The state is a built-in React object that is used to contain data or information about the component.
A component’s state can change over time; whenever it changes, the component re-renders.
State is an object that holds some information, which can be used across requests.
React Class component is by default configured with state. It can use the state object of “React.Component” base class.
Functional components are not configured with state.
A state can be modified based on user action or network changes.
State object must be defined with an initial value.
State must be initialized.
Every time the state of an object changes, React re-renders the component to the browse
The state object can store multiple properties
It must be configured in “Constructor”
You can set value into state by using “setter” method “setState()”
The setState() Method:- State can be updated in response to event handlers, server responses, or prop changes. This is done using the setState() method. The setState() method enqueues all of the updates made to the component state and instructs React to re-render the component and its children with the updated state.
EX:-
class CarsComponent extends React.Component
{
constructor(props) {
super(props);
this.state = {
title: 'Cars Name',
{ Brand: 'Hyundai', Fueltype: 'petrol'},
}
updateName() {
this.setState({ title: 'Cars Brands' });
}
render() {
return(
<div>
{this.state.title}
{this.state.Brand}
{this.state.Fueltype}
</div>
)
}
}
export default CarsComponent