Question

我正在尝试设置状态，然后在设置之后再调用当前状态的另一个函数。

我有这种代码

this.setState({
      candidates : diCandi
    },()=>{
      this.createDataSource(this.state)
      console.log("The state is=>",this.state);
    });

我想用刚更新的状态调用this.createDataSource(this.state)。它不工作我想知道为什么。我有什么不对的吗

当我退出状态时。我从来没有在日志中看到代码。

Answer 1

class App extends React.Component{
  constructor(props){
    super(props)
    this.state = { candidates: "no candidates" }
  }
  
  shouldComponentUpdate(){
    return false;
  }
  
  buttonClick(e){
    this.setState({candidates: "diCandi"}, () => console.log("updated"))
  }
  
  render(){
    return(
    <div>
        <button onClick={this.buttonClick.bind(this)}>set candidates</button>
        <b>{this.state.candidates}</b>

      </div>
    )
  }
}

const MOUNT_NODE = document.getElementById('container')
ReactDOM.render(<App />, MOUNT_NODE)

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="container">

代码应该像Sagar之前提到的那样工作，this.setState（）上的回调只在设置状态后启动。即使shouldComponentUpdate返回false

，回调仍然有效

Answer 2

您将所有州发送到createDataSource您可以做的

this.setState({
  candidates : diCandi
},()=>{
  this.createDataSource(this.state.candidates) 
  console.log("The state is=>",this.state.candidates);
});

还建议从createDataSource方法访问状态，而不是将其作为参数发送

this.setState({
  candidates : diCandi
},()=>{
  this.createDataSource() 
  console.log("The state is=>",this.state.candidates);
});

然后在createDataSource

createDataSource() {
  this.state.candidates
  .... rest of code
}

this.setState没有工作

2 个答案: