我有一个使用称为模型的JavaScript对象和一个接受输入的文本字段呈现的表单。基于此,需要更新状态。
不幸的是,状态已更新为最后一个输入项。并非所有表单中的值都已填写。
我没有设法使这里提到的方法对我有用:How to fill a specific state with a dynamic key?
constructor(props) {
super(props);
this.state = {
Form:{},
}
}
onChange = (e, key, type) => {
let list = [];
if (type === "text") {
list[key] = e.target.value;
}
else {
// LOGIC TO HANDLE NON TEXT VALUES
let found = this.state.Form[key]? true : false;
if (found) {
list[key] = false;
} else {
list[key]= true;
}
}
this.setState({ Form: list });
};
renderform = () => {
return model.map(m => {
<TextField
type={m.type}
key={m.key}
onChange={event => { this.onChange(event, m.key, "text"); }}
/>
})
}
答案 0 :(得分:1)
尝试一下:
array(
"Maria.php" => "Ioana.php",
"Ioana.php" => "Maria.php"
)
因为当您使用this.setState(prevState => ({ Form: {...prevState.Form, ...list} }));
时,您的this.setState({ Form: list });
状态每次都会被新数组覆盖。