相关疑难解决方法(0)

this.state里面的setState ReactJS

所以我对ReactJS中setState的异步性质有些困惑.根据React docs,你不应该在setState()中使用this.state.但是,如果我有一个计数器作为一个状态,我想点击这样更新它:

class App extends React.Component {
    state = { counter: 0 }

    onClick = () => {
        this.setState({counter: this.state.counter + 1})
    }

    render() {
        return (
          <div>
            <div>{this.state.counter}</div>
            <p onClick={this.onClick}>Click me</p>
          </div>
        )
    }
}
Run Code Online (Sandbox Code Playgroud)

这按预期工作.那么为什么这段代码错了呢?

更新:我知道setState是异步的,它接受一个回调,它有一个先前的状态作为参数,但我不知道为什么我应该在这里使用它?我想引用setState中的旧状态,那么为什么我应该在这种情况下使用回调函数呢?无论什么时候this.setState()执行,this.state它内部总是会引用旧状态,只有在setState完成执行后才会将其值更改为新状态,而不是在执行时.

javascript reactjs

2
推荐指数
2
解决办法
2822
查看次数

标签 统计

javascript ×1

reactjs ×1