React গতিশীল ডেটা পরিচালনা এবং ইউজার ইন্টারফেস সিঙ্ক্রোনাইজ করার একটি গুরুত্বপূর্ণ দিক হল ইন স্টেট পরিচালনা । রাজ্য একটি উপাদানের বর্তমান অবস্থার প্রতিনিধিত্ব করে এবং অ্যাপ্লিকেশনটির সম্পাদনের সময় পরিবর্তন করতে পারে।
ইন React, স্টেট হল একটি জাভাস্ক্রিপ্ট অবজেক্ট যা গুরুত্বপূর্ণ তথ্য ধারণ করে যা একটি উপাদানকে সময়ের সাথে সঞ্চয় এবং পরিবর্তন করতে হবে। যখন অবস্থা পরিবর্তন হয়, React স্বয়ংক্রিয়ভাবে এই পরিবর্তনগুলি প্রতিফলিত করার জন্য ব্যবহারকারী ইন্টারফেস আপডেট করে।
রাজ্য পরিচালনা করতে React, আমরা একটি বিশেষ সম্পত্তি ব্যবহার করি যার নাম state
। আমরা কম্পোনেন্টের কনস্ট্রাক্টরে স্টেট ডিক্লেয়ার করি এবং এর প্রারম্ভিক মান শুরু করি। তারপর, আমরা পদ্ধতি ব্যবহার করে রাষ্ট্রের মান পরিবর্তন করতে পারি setState()
।
উদাহরণস্বরূপ, আসুন একটি সাধারণ কাউন্টার উপাদান বিবেচনা করা যাক:
import React, { Component } from 'react';
class Counter extends Component {
constructor(props) {
super(props);
this.state = {
count: 0
};
}
incrementCount =() => {
this.setState(prevState =>({
count: prevState.count + 1
}));
}
render() {
return(
<div>
<p>Count: {this.state.count}</p>
<button onClick={this.incrementCount}>Increment</button>
</div>
);
}
}
export default Counter;
উপরের উদাহরণে, আমরা count
0 এর প্রারম্ভিক মান সহ একটি স্টেট ঘোষণা করি। যখন ব্যবহারকারী "ইনক্রিমেন্ট" বোতামে ক্লিক করেন, তখন পদ্ধতিটি count
ব্যবহার করে এর মান একটি দ্বারা বৃদ্ধি করা হয় । setState()
অবস্থা পরিচালনা আমাদের বর্তমান অবস্থার উপর ভিত্তি করে একটি উপাদানের বিষয়বস্তু এবং আচরণ পরিবর্তন করতে দেয়। গতিশীল উপাদান তৈরি এবং ব্যবহারকারীর সাথে ইন্টারঅ্যাক্ট করার সময় এটি কার্যকর।