props এবং state এর মধ্যে পার্থক্য কী?

Question

Accepted Answer

উভয়ই এমন ডেটা ধারণ করে যা একটি component কী render করে তা প্রভাবিত করে, কিন্তু তারা **ডেটা কার মালিকানা** এবং **এটি পরিবর্তন করা যায় কিনা** এতে আলাদা। - **props** একটি component এর প্যারেন্ট থেকে component এ *পাস করা হয়*। এগুলি **read-only** — component অবশ্যই সেগুলি কখনও modify করবে না। - **state** component এর *ভিতরে* মালিকানা এবং পরিচালনা করা হয়। এটি সময়ের সাথে পরিবর্তিত হতে পারে, এবং এটি পরিবর্তন করা একটি **re-render** ট্রিগার করে। ## উদাহরণ ```jsx // `step` is a PROP — given by the parent, the child only reads it. // `count` is STATE — owned here, changes on click, causes a re-render. function Counter({ step }) { const [count, setCount] = useState(0); return ( ); } // Parent decides the step and passes it down: ``` ডেটা **নিচে** প্রবাহিত হয় (প্যারেন্ট → চাইল্ড props এর মাধ্যমে) এবং পরিবর্তনগুলি **উপরে** প্রবাহিত হয় (চাইল্ড প্যারেন্টকে কিছু পরিবর্তন করতে বলে একটি callback prop এর মাধ্যমে যেমন `onChange`)। এই one-way flow হল যা React অ্যাপ্লিকেশনগুলিকে predictable করে তোলে। ## কোনটি ব্যবহার করতে হবে তা সিদ্ধান্ত করার উপায় - উপর থেকে আসে এবং component এটি পরিবর্তন করা উচিত নয় → **prop**। - Component সময়ের সাথে এটি পরিবর্তন করতে হবে → **state**। - Props mutate করা (`props.x = 1`) একটি bug — React re-render করবে না এবং আপনি প্যারেন্টের মালিকানা ভেঙে দিয়েছেন। একটি prop "পরিবর্তন করতে", প্যারেন্ট আপনাকে যে callback দিয়েছে তা call করুন যাতে প্যারেন্ট তার নিজের state আপডেট করে এবং নতুন মান নিচে পাস করে।