React 中this.setStat是批量执行的, 它发现做三次是多余的,所以只执行一次

时间:2023-03-10 03:37:48
React 中this.setStat是批量执行的, 它发现做三次是多余的,所以只执行一次
16==》 this.setStat是批量执行的  它发现做三次是多余的,所以只执行一次
import React, { Component } from "react"; export default class StaTest extends Component {
state = {
nun: 1
}; componentDidMount() {
// this.setStat是批量执行的 它发现做三次是多余的,所以只执行一次
this.setState({
nun: this.state.nun + 1
}); this.setState({
nun: this.state.nun + 1
}); this.setState({
nun: this.state.nun + 1
});
} render() {
return (
<div>
{/* 获取state中的值 最终为2*/}
{this.state.nun}
</div>
);
}
}
如何让他执行三次
更改为this.setState this.setState(prevState=>{
return{
nun:prevState.nun+1
}
}) this.setState(prevState => {
return {
nun: prevState.nun + 1
}
}) this.setState(prevState => {
return {
nun: prevState.nun + 1
}
}) 可以优化为
this.setState(prevState => ({
nun: prevState.nun + 1
}))