盒子
盒子
文章目录
  1. 我认为this.setState是react中最常用的API了.

react中setState的使用

我认为this.setState是react中最常用的API了.

如果不明白this.setState是什么, 请移驾官网查看具体api

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
class Timer extends React.Component {
constructor(props) {
super(props);
this.state = {secondsElapsed: 0};
}
tick() {
this.setState((prevState) => ({
secondsElapsed: prevState.secondsElapsed + 1
}));
}
componentDidMount() {
this.interval = setInterval(() => this.tick(), 1000);
}
componentWillUnmount() {
clearInterval(this.interval);
}
render() {
return (
<div>Seconds Elapsed: {this.state.secondsElapsed}</div>
);
}
}
ReactDOM.render(<Timer />, mountNode);

先看看this.setState是干什么的

setState流程图

这里有必要说一下, this.setState是异步调用,
如果想要使用不同执行, 它的第二个参数是回调函数, 列队到达执行完修改state中状态后执行回调函数