এটি বোঝার চেষ্টা করার জন্য আমি রেডাক্সের টুডো উদাহরণটি ছিন্ন করছি। আমি পড়েছি যা প্রপেশন mapDispatchToProps
হিসাবে প্রেরণ ক্রিয়াকলাপগুলিকে ম্যাপ করতে দেয়, তাই আমি addTodo.js
ডিসপ্যাচ (অ্যাডডোডো ()) কল করার পরিবর্তে মানচিত্রডিস্পচটপোপ্রোপগুলি ব্যবহার করতে পুনরায় লেখার কথা ভাবি । আমি বলেছি 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.
। আমি কখনই mapStateToProps
অ্যাডটোডো উপাদানটি দিয়ে শুরু করতাম না , তাই আমি কী নিশ্চিত তা নিশ্চিত ছিল না। আমার অন্ত্র অনুভূতি বলে যে পূর্বে 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
সম্পূর্ণ রেপো এখানে পাওয়া যাবে ।
সুতরাং আমার প্রশ্নটি হ'ল ম্যাপস্টেটটোপ্রপস ছাড়াই কি ম্যাপডিস্পচটপোপ্রোপগুলি করা সম্ভব? আমি যা গ্রহণযোগ্য অনুশীলন করার চেষ্টা করছি তা যদি হয় না - তবে কেন হয় না?