Būsenos valdymas React yra svarbus dinaminių duomenų tvarkymo ir vartotojo sąsajų sinchronizavimo aspektas. Būsena nurodo esamą komponento būseną ir gali keistis programos vykdymo metu.
Būsena React yra „JavaScript“ objektas, kuriame yra svarbi informacija, kurią komponentas turi saugoti ir keisti laikui bėgant. Pasikeitus būsenai, React vartotojo sąsaja automatiškai atnaujinama, kad atspindėtų šiuos pakeitimus.
Norėdami valdyti būseną React, naudojame specialią ypatybę, vadinamą state
. Būseną deklaruojame komponento konstruktoriuje ir inicijuojame jo pradinę reikšmę. Tada mes galime modifikuoti būsenos vertę naudodami metodą setState()
.
Pavyzdžiui, panagrinėkime paprastą skaitiklio komponentą:
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;
Aukščiau pateiktame pavyzdyje deklaruojame būseną, iškviestą count
su pradine reikšme 0. Kai vartotojas spusteli mygtuką "Padidinti", reikšmė count
padidinama vienu naudojant setState()
metodą.
Valdymo būsena leidžia keisti komponento turinį ir elgesį pagal esamą būseną. Tai naudinga kuriant dinaminius komponentus ir bendraujant su vartotoju.