价值不是写入此的。

Question

在React页面上，我有一种方法正在尝试设置状态。但是，它似乎不起作用（请参阅console.log）。我在做什么错？

editPlan = (cell, row) => {
    return (
        <img
            src={edit}
            alt="edit"
            onClick={() => {

                console.log(row.id);                                     // prints 2

                this.setState({ editId: row.id, openEditModal: true });

                console.log(JSON.stringify(this.state.editId));          // prints "". I would expect 2.
                console.log(JSON.stringify(this.state.openEditModal));   // prints false. I would expect true.

                this.props.getPlan(row.id);
            }}
        />
    );
};

Answer 1

setState不同步 - 它只是排队您所需的状态更改，并以后将其进行优化，以优化组件将如何重新渲染。

您可以将函数回调为最后一个参数，当状态更改发生时将被调用。

this.setState(
  { editId: row.id, openEditModal: true },
  () => {
    console.log(JSON.stringify(this.state.editId));
    console.log(JSON.stringify(this.state.openEditModal));
  }
);

请参阅： https://reaectjs.s.s.org/docs/react-compont.html.html#setstate < /a>

Answer 2

您可以尝试使用状态回调函数，因为 setState工作异步

this.setState({ editId: row.id, openEditModal: true },()=>{
      console.log(JSON.stringify(this.state.editId));          
      console.log(JSON.stringify(this.state.openEditModal));  
      this.props.getPlan(row.id);
  });