সুতরাং আমি এক সপ্তাহ আগে প্রতিক্রিয়া শিখতে শুরু করেছিলাম এবং আমি অনিবার্যভাবে রাষ্ট্রের সমস্যা এবং কীভাবে উপাদানগুলির অ্যাপ্লিকেশনটির সাথে বাকী অংশে যোগাযোগ করার কথা ভাবা যায় তা বুঝতে পেরেছি। আমি আশেপাশে অনুসন্ধান করেছি এবং রেডাক্স মাসের স্বাদ বলে মনে হচ্ছে। আমি সমস্ত নথিপত্র পড়েছি এবং আমি মনে করি এটি আসলে একটি দুর্দান্ত বিপ্লবী ধারণা। এটি সম্পর্কে আমার ধারণা এখানে:
স্টেট সাধারণত প্রোগ্রামিংয়ে বেশ মন্দ এবং বাগের এক বিশাল উত্স হিসাবে সম্মত হয়। আপনার অ্যাপ্লিকেশন জুড়ে এটিকে ছড়িয়ে দেওয়ার পরিবর্তে রেডাক্স বলছে যে কেবলমাত্র এটি সমস্ত বিশ্বব্যাপী রাষ্ট্রীয় গাছের মধ্যে কেন্দ্রীভূত করা হয়নি যা আপনাকে পরিবর্তনের জন্য ক্রিয়াকলাপ ছড়িয়ে দিতে হবে? আকর্ষণীয় মনে হচ্ছে। সমস্ত প্রোগ্রামের রাষ্ট্র দরকার তাই আসুন এটি একটি অপরিষ্কার জায়গায় আটকে দিন এবং কেবল সেখান থেকে এটি পরিবর্তন করুন যাতে বাগগুলি ট্র্যাক করা সহজ হয়। তারপরে আমরা ঘোষণামূলকভাবে পৃথক রাষ্ট্রের টুকরোগুলি প্রতিক্রিয়া উপাদানগুলিতে আবদ্ধ করতে পারি এবং সেগুলিকে স্বয়ংক্রিয়ভাবে পুনরায় আঁকতে পারি এবং সবকিছু সুন্দর is
তবে এই পুরো নকশাটি সম্পর্কে আমার দুটি প্রশ্ন রয়েছে। একটির জন্য, কেন রাজ গাছটি অপরিবর্তনীয় হওয়া দরকার? বলুন আমি টাইম ট্র্যাভেল ডিবাগিং, হট রিলোডলোডের বিষয়ে চিন্তা করি না এবং ইতিমধ্যে আমার অ্যাপ্লিকেশনটিতে পূর্বাবস্থায় ফিরানো / পুনরায় বাস্তবায়ন করেছি। এটি করা এতটা জটিল বলে মনে হচ্ছে:
case COMPLETE_TODO:
return [
...state.slice(0, action.index),
Object.assign({}, state[action.index], {
completed: true
}),
...state.slice(action.index + 1)
];
এর পরিবর্তে:
case COMPLETE_TODO:
state[action.index].completed = true;
উল্লেখ করার জন্য নয় যে আমি কেবল শিখতে একটি অনলাইন হোয়াইটবোর্ড তৈরি করছি এবং প্রতিটি রাজ্যের পরিবর্তন কমান্ড তালিকায় ব্রাশ স্ট্রোক যুক্ত করার মতো সহজ হতে পারে। কিছুক্ষণ পরে (শত শত ব্রাশ স্ট্রোক) এই পুরো অ্যারেটির সদৃশকরণ অত্যন্ত ব্যয়বহুল এবং সময়সাপেক্ষ হতে শুরু করবে।
আমি এমন এক গ্লোবাল রাষ্ট্র গাছের সাথে ঠিক আছি যেটি ইউআই থেকে স্বাধীন যা কর্মের মাধ্যমে রূপান্তরিত হয়, তবে আসলেই কি এটি অপরিবর্তনীয় হওয়া দরকার? এর মতো সরল বাস্তবায়নে কী ভুল হয়েছে (খুব রুক্ষ খসড়া। 1 মিনিটে লিখেছেন)?
var store = { items: [] };
export function getState() {
return store;
}
export function addTodo(text) {
store.items.push({ "text": text, "completed", false});
}
export function completeTodo(index) {
store.items[index].completed = true;
}
এটি এখনও একটি গ্লোবাল স্টেট ট্রি হিসাবে নির্গত ক্রিয়াকলাপের মাধ্যমে রূপান্তরিত হয়েছে তবে অত্যন্ত সহজ এবং দক্ষ।
immutablejsকরতে নিন এবং ব্যবহার করুনreturn state.setIn([action.index, 'completed'], true);।