Question

所以我有一个弹出窗口，里面有一些单选按钮和输入字段。 handleClick按钮上有一个OK函数，它可以处理更新状态并关闭弹出窗口。执行完这些操作并弹出窗口关闭后，我试图清除状态属性。

handleClick = () => {
  if(this.state.val === "1") {
    //do something
  } else if (this.state.val === "2") {
    //do something
  }
  //once if conditions are performed, clear the state
  this.setState({val: "0"}); //this is what i do right now
}

重新打开弹出窗口时，setState正在更新状态。

Answer 1

好的，试试这个添加setstate，最后将输入/单选按钮的状态更改为空。

handleClick = () => {
  if(this.state.val === "1") {
    //do something
  } else if (this.state.val === "2") {
    //do something
  }
  //once if conditions are performed, clear the state
  this.setState({val: "" or null }); //keep it empty or null
}

以及无线电输入添加检查方法并将状态传递给它，以便如果它为空/空它将被取消选中

<input type="radio" checked={this.state.val} />

或第二种方法可以使用reset（）方法。

为你的表单元素添加一个ref

<form ref={(input) => this.resetForm = input}></form>

handleClick = () => {
  if(this.state.val === "1") {
    //do something
  } else if (this.state.val === "2") {
    //do something
  }
  //Use the ref to target the form and apply reset method to it
  this.resetForm.reset();
}

点击弹出窗口并不清除状态

1 个答案: