如何在反应中设置状态后立即获取复选框值

Question

我想要在设置状态后立即显示复选框值。在下面的代码中，我希望设置状态后 handelchange 中的复选框值我在那边添加了控制台

state = {
status: false,
}

handleChange = (event) => {
this.setState((prevState) => {
   return {
      ...prevState,
      status: !prevState.status
   }
})
 ====console.log(this.state.status)====//if it checked and set i should get true
 }


<Form.Check
type="checkbox" 
label="Consigne temporaire"
value={this.state.status}
onChange={this.handleChange}
 />

Answer 1

您可以使用 useEffect 或 componentDidUpdate 并将复选框状态与其绑定。

state = {
status: false,
}

componentDidUpdate(prevProps, prevState) {
  if (prevState.status !== this.state.status) {
    console.log('Checkbox State change',this.state.status)
  }
}

handleChange = (event) => {
this.setState((prevState) => {
   return {
      ...prevState,
      status: !prevState.status
   }
})
 ====console.log(this.state.status)====//if it checked and set i should get true
 }


<Form.Check
type="checkbox" 
label="Consigne temporaire"
value={this.state.status}
onChange={this.handleChange}
 />

Answer 2

您可以将回调作为第二个参数传递给 this.setState，保证在状态更新后运行（参见 docs on setState）

this.setState((prevState) => {
  return {
     ...prevState,
     status: !prevState.status
  }
}, () => {
  console.log(this.state.status)
})

如何在反应中设置状态后立即获取复选框值

How to get checkbox value immediately after setting the state in react

javascript

typescript

reactjs

react-redux