मैं इसे समझने की कोशिश करने के लिए Redux के टूडू उदाहरण को तोड़ रहा हूं। मैंने पढ़ा कि mapDispatchToPropsआप प्रॉप्स के रूप में प्रेषण क्रियाओं को मैप करने की अनुमति देते हैं, इसलिए मैंने addTodo.jsडिस्पैच (addTodo ()) को कॉल करने के बजाय mapDispatchToProps का उपयोग करने के लिए फिर से लिखने के बारे में सोचा । मैंने उसे फोन किया addingTodo()। कुछ इस तरह:
import React from 'react';
import {connect} from 'react-redux';
import addTodo from '../actions';
let AddTodo = ({addingTodo}) => {
let input;
return (
<div>
<form onSubmit={e => {
e.preventDefault()
if (!input.value.trim()) {
return
}
addingTodo(input.value)
input.value = ""
}}>
<input ref={node => {
input = node
}} />
<button type="submit">Submit</button>
</form>
</div>
)
}
const mapDispatchToProps = {
addingTodo: addTodo
}
AddTodo = connect(
mapDispatchToProps
)(AddTodo)
export default AddTodoहालाँकि, जब मैं ऐप चलाता हूं, मुझे यह त्रुटि मिलती है Error: Invalid value of type object for mapStateToProps argument when connecting component AddTodo.:। मैं कभी भी mapStateToPropsAddTodo घटक के साथ शुरू नहीं करता था, इसलिए मुझे यकीन नहीं था कि क्या गलत था। मेरी आंत भावना कहती है कि पूर्ववर्ती connect()होने की उम्मीद mapStateToPropsहै mapDispatchToProps।
काम का मूल इस तरह दिखता है:
import React from 'react';
import {connect} from 'react-redux';
import addTodo from '../actions';
let AddTodo = ({dispatch}) => {
let input;
return (
<div>
<form onSubmit={e => {
e.preventDefault()
if (!input.value.trim()) {
return
}
dispatch(addTodo(input.value))
input.value = ""
}}>
<input ref={node => {
input = node
}} />
<button type="submit">Submit</button>
</form>
</div>
)
}
AddTodo = connect()(AddTodo)
export default AddTodoपूरा रेपो यहां पाया जा सकता है ।
तो मेरा सवाल यह है कि क्या mapStispToProps के बिना mapDispatchToProps करना संभव है? क्या मैं एक स्वीकार्य अभ्यास करने की कोशिश कर रहा हूं - यदि नहीं, तो क्यों नहीं?