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
जब प्रयोगकर्ताले "बढ्दो" बटनमा क्लिक गर्छ, विधि count
प्रयोग गरेर एकले बढाइन्छ । setState()
प्रबन्धन राज्यले हामीलाई हालको अवस्थाको आधारमा कम्पोनेन्टको सामग्री र व्यवहार परिवर्तन गर्न अनुमति दिन्छ। गतिशील कम्पोनेन्टहरू सिर्जना गर्दा र प्रयोगकर्तासँग अन्तरक्रिया गर्दा यो उपयोगी हुन्छ।