Question

使用ref的OnSubmit函数获取所有表单数据并添加到react（仍然在同一页面）中的状态值中，现在用户更改表单中的一个输入字段并提交，是否已收集更改后的值并将其更新为状态，但状态值显示以前的表单值和新编辑的表单值。我只想要状态中的新表单值。友善的帮助

我试图通过使状态值不确定来清除状态值，每个提交函数都为null

constructor (props) {
...
this.state = {
  data :[]
}


render {
...
...
<table>
<select ref={country0} name=country0>
 <option value="china">china</option>
  ....

<select ref={country1} name=country1>
 <option value="London">London</option>
  .....

 onSubmit = event => {
  ....
 let country = [];

 //for loop (looping table row's for iteration)
   temp = ReactDOM.findDOMNode(this.refs['country' +i]);
        country[i] = temp.value; //adding value to the array

 const info = {country : country};//country array
 const data = this.state.data;

 data.push(info);

 this.setState({
   data:data
  });

//also tired 
const data = [...this.state.data, info]

this.setState({
  data:data
});

displaying state value 
 Actual :

china
London

on edit (user changes China to Japan and London to China) 
I got

  china  ---- previous value
  London ----- previous value
  Japan
  china

Expected :

Japan
china

Answer 1

似乎您是将数据追加到数组中，而不是用新值替换它。如果您不想保留以前的结果，则应该初始化一个新数组。

const info = {country : country};//country array
 const data = [];

 data.push(info);

 this.setState({
   data:data
  });

Reactjs中的State持有先前的状态值，如何使用新的已编辑表单值更新状态

1 个答案: