Question

this.state = {
   old: null,
   new: null
}

componentDidMount() {
  // get data
  this.setState({old: data, new: data})
}

updateData() {
  // some code
  this.setState({new: newData})
}

上面的代码在updateData（）中更新了旧的和新的，我想要的是获取数据并将其存储在2个不同的变量（旧的和新的）中，使用用户输入来更新新内容并比较/发送到服务器等。

编辑：输入更改部分

<label for="pname">
  Min: {this.state.old.parameters[i][1]}
</label>
<input
  name={"p-" + item[0]}
  className="form-control"
  value={this.state.new.parameters[i][1]}
  onChange={e => this.handleChange(e, i, 1)}
/>

更改手柄：

handleChange(e, i, x) {
  let temp = this.state.new;
  temp.parameters[i][x] = e.target.value;
  this.setState({ new: temp });
}

编辑：这是一个描述我的问题的简单示例。当您更改第一个输入时，所有其他输入也在不应该更改的地方

DataFrame.select_dtypes

Answer 1

在调用setState时，也必须保留原始内容，这可以通过使用{... this.state，//和任何参数更改（例如new：newData等）}完成。此外，问题还涉及到Shallow和Deep在js中复制对象。分配对象，例如-let temp={...this.state.new}复制对象的Shallow，并且两个引用都指向同一个对象！我进行了必要的更改，希望它能起作用！

更改手柄：

handleChange(e, i, x){
    let temp = JSON.parse(JSON.stringify(this.state));
    temp.new.parameters[i][x] = e.target.value;
    this.setState({...this.state, new: temp.new});
};

更新数据功能调用：

updateData(){
    // some code
    this.setState({...this.state, new: newData});
}

在镜像状态下反应setState

1 个答案: