我有以下代码片段:
onChange(e) {
e.persist
this.setState((prevState) => {
prevState[e.target.id] = e.target.value
return prevState
})
}
如何使用类似上面的代码设置每个键的状态。
这是初始状态:
this.state = {
heading: this.props.match.params.length > 1 ? "Edit Post" : "Create Post",
title: '',
category: '',
body: '',
author: ''
}
答案 0 :(得分:17)
基本规则是:
我们可以使用Computed property names概念并使用任何 js表达式来动态计算对象属性名称。为此,我们需要将表达式放在[]
中。
像这样:
var obj = {
[10 * 20 + 1 - 5]: "Hello"
};
console.log('obj = ', obj);
<强>解决方案:强>
根据您发布的代码,您需要将e.target.id
放在[]
内,如下所示:
onChange(e) {
this.setState({
[e.target.id]: e.target.value
})
}
或者我们可以先创建该对象,然后将该对象传递给setState
函数,如下所示:
onChange(e) {
let obj = {};
obj[e.target.id] = e.target.value
this.setState(obj);
}
此外,您不需要prevState
。您可以使用新值直接更新状态变量。仅当新状态值依赖于先前的状态值时才需要prevState
,例如计数器。