Reactjs中的状态保存以前的状态值,如何使用新编辑的表单值更新状态

Reactjs中的状态保存以前的状态值,如何使用新编辑的表单值更新状态,reactjs,Reactjs,使用ref的OnSubmit函数获取所有表单数据并添加到react中的状态值(仍在同一页面中)现在用户更改表单中的一个输入字段并提交。更改后的值将被收集并更新到状态,但状态值同时显示以前的表单值和新编辑的表单值。我只需要状态中的新表单值。好心帮忙 我试图通过在每个submit函数上使其未定义为null来清除state值 constructor (props) { ... this.state = { data :[] } render { ... ... <table> &l

使用ref的OnSubmit函数获取所有表单数据并添加到react中的状态值(仍在同一页面中)现在用户更改表单中的一个输入字段并提交。更改后的值将被收集并更新到状态,但状态值同时显示以前的表单值和新编辑的表单值。我只需要状态中的新表单值。好心帮忙

我试图通过在每个submit函数上使其未定义为null来清除state值

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
构造函数(道具){
...
此.state={
数据:[]
}
渲染{
...
...
中国
....
伦敦
.....
onSubmit=事件=>{
....
让国家=[];
//for循环(循环表行进行迭代)
temp=ReactDOM.findDOMNode(this.refs['country'+i]);
country[i]=temp.value;//向数组添加值
const info={country:country};//国家数组
const data=this.state.data;
数据推送(信息);
这是我的国家({
数据:数据
});
//也累了
const data=[…this.state.data,info]
这是我的国家({
数据:数据
});
显示状态值
实际:
中国
伦敦
编辑时(用户将中国更改为日本,将伦敦更改为中国)
我得到了
中国——以前的价值
伦敦——以前的价值
日本
中国
预期:
日本
中国

您似乎是在向数组中添加数据,而不是用新值替换。如果不想保留以前的结果,您应该初始化一个新数组

const info={country:country};//国家数组
常量数据=[];
数据推送(信息);
这是我的国家({
数据:数据
});

您似乎是在向数组中添加数据,而不是用新值替换。如果不想保留以前的结果,您应该初始化一个新数组

const info={country:country};//国家数组
常量数据=[];
数据推送(信息);
这是我的国家({
数据:数据
});

我只是复制了他的代码并应用了一个简单的更改。没必要太粗鲁。谢谢你的回复。如前所述,现在{this.state.data}保存一些数据正确吗?现在我想再次将新值更新为状态,然后我们将使用当前表单数据获取以前的状态。这就是问题所在。你明白我的意思吗?我只是复制了他的代码并应用了一个简单的更改。不必太粗鲁。感谢你的回答。如前所述,现在{this.state.data}保存一些数据是否正确?现在我想再次将新值更新为状态,然后我们将使用当前表单数据获取以前的状态。这就是问题所在。你明白我的意思吗?这是一个糟糕的问题,写得不好,代码示例不好。请编辑你的问题,并使用干净的代码解释你的问题。嗨,novonimo,我只想我用简单的语言解释了我的场景。我不明白你在代码中发现了什么不好,我刚刚给出了状态、呈现和提交事件以及实际和预期结果。我解决了我的问题,将状态变量从[]更改为{}这是一个糟糕的问题,有糟糕的文字和糟糕的代码示例。请编辑您的问题,并使用干净的代码来解释您的问题。嗨,novonimo,我只是按照说明发布了问题,为了让问题变得简单,我用简单的文字解释了我的场景。我不明白您在我刚才给出的代码中发现了什么不好的地方,呈现一个nd在提交事件和实际及预期结果时,我修复了我的问题,将状态变量从[]更改为{}