setstate in react js code example
Example 1: state with react functions
import React, { useState } from 'react';
function Example() {
// Declare a new state variable, which we'll call "count"
const [count, setCount] = useState(0);
return (
You clicked {count} times
);
}
Example 2: set state
class App extends React.Component {
state = { count: 0 }
handleIncrement = () => {
this.setState({ count: this.state.count + 1 })
}
handleDecrement = () => {
this.setState({ count: this.state.count - 1 })
}
render() {
return (
{this.state.count}
)
}
}
Example 3: state with react functions
class Example extends React.Component {
constructor(props) {
super(props);
this.state = {
count: 0
};
}
render() {
return (
You clicked {this.state.count} times
);
}
}
Example 4: setstate react js
constructor(props) {
super(props);
this.state = {
isActive: true,
};
}
checkStatus = () => {
this.setState({ // use this function
'isActive' : !this.state.isActive,
});
}
Example 5: lifecycles if reactjs
class Clock extends React.Component {
constructor(props) {
super(props);
this.state = {date: new Date()};
}
componentDidMount() { }
componentWillUnmount() { }
render() {
return (
Hello, world!
It is {this.state.date.toLocaleTimeString()}.
);
}
}
Example 6: setstate in react
Functional Component
const [counter, setCounter] = useState(0);
setCouter(counter + 1);