მდგომარეობის მართვა React დინამიური მონაცემების დამუშავებისა და მომხმარებლის ინტერფეისების სინქრონიზაციის მნიშვნელოვანი ასპექტია. სახელმწიფო წარმოადგენს კომპონენტის მიმდინარე მდგომარეობას და შეიძლება შეიცვალოს განაცხადის შესრულების დროს.
in React, state არის JavaScript ობიექტი, რომელიც ინახავს მნიშვნელოვან ინფორმაციას, რომელიც კომპონენტს დროთა განმავლობაში უნდა შეინახოს და შეცვალოს. როდესაც მდგომარეობა იცვლება, React ავტომატურად განახლდება მომხმარებლის ინტერფეისი, რათა აისახოს ეს ცვლილებები.
სახელმწიფოს სამართავად React ვიყენებთ სპეციალურ თვისებას, სახელწოდებით state
. ჩვენ ვაცხადებთ მდგომარეობას კომპონენტის კონსტრუქტორში და ვაყენებთ მის საწყის მნიშვნელობას. შემდეგ, ჩვენ შეგვიძლია შევცვალოთ მდგომარეობის მნიშვნელობა setState()
მეთოდის გამოყენებით.
მაგალითად, განვიხილოთ მარტივი Counter კომპონენტი:
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. როდესაც მომხმარებელი დააჭერს ღილაკს "Increment", მნიშვნელობა count
იზრდება ერთით setState()
მეთოდის გამოყენებით.
მდგომარეობის მართვა საშუალებას გვაძლევს შევცვალოთ კომპონენტის შინაარსი და ქცევა მიმდინარე მდგომარეობიდან გამომდინარე. ეს სასარგებლოა დინამიური კომპონენტების შექმნისა და მომხმარებელთან ურთიერთობისას.