我有这样的状态
state = {
params: {}
}
假设我们通过 this.setState({params:{data:2}})
设置参数,那么当我们想要恢复到其初始状态时,我们调用 this.setState ({参数:{}})
。状态已恢复,但问题是 View 仍然呈现 2(this.state.params.data 的值)。唯一有效的方法是我调用 this.setState({params:{data:''}})
。想象一下,如果我们有很多字段,我们就不会这样做。有什么解决办法吗?
codesandbox 的链接是 here
最佳答案
您可以通过对 value 属性使用三元运算符来解决此问题。请参阅工作沙箱:https://codesandbox.io/s/blissful-clarke-l2pif
<Input
value={params["data"] ? params["data"] : ""}
onChange={(e, { value }) => {
this.buildParams("data", value);
}}
/>
这会起作用,因为它强制语义ui标记有条件地检查我们状态中的值,而不是使用像params.data
这样的静态绑定(bind)。如果对象中有 data
属性,那么我们将使用它的值。如果没有,则显示空字符串。
输入使用的值始终受到控制,并且在将 params
恢复为 {}
时不会保留。我假设您可以使用与每个输入对应的特定名称
或键
交换数据。
关于javascript - ReactJS setState 为空白对象不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57722552/