我有一个使用 JavaScript 对象填充的空状态，如下所示：
constructor(props) {
super(props);
this.state = {}
}
initialStateSet = (model) => {
model.map(m => this.setState({ [m.key]: null
}))
}
我想创建一个特定的状态并用这些值填充它，而不是像这样：
constructor(props) {
super(props);
this.state = {
EmptyList: {}
}
}
initialStateSet = (model) => {
model.map(m => this.setState({ EmptyList: {[m.key]: null } } )
}
不幸的是，它只填充了最后一个值，而不是像我想要的那样填充对象的所有值
问题 ：
// issue with this is, it always update `EmptyList` with next value
// you are assigning a new object to `EmptyList` everytime instead appending
// so as result, you will always get the last one
model.map(m => this.setState({ EmptyList: {[m.key]: null } } )
解决方案 ：
我想，这就是你想要的是：
const list = {};
model.forEach(m => { list[m.kye] = null })
// instead o updating state in loop
// you should update the state only once, this is more preferable,
this.setState({ EmptyList : list });
有两种方法可以做到这一点：
使用以前的状态
initialStateSet = (model) => {
model.map(m => {
this.setState(prev => ({ EmptyList: { ...prev.EmptyList, [m.key]: null } }))
});
}
首先创建列表，然后更新状态
initialStateSet = (model) => {
const list = model.map(m => ({[m.key]: null }))
this.setState({ EmptyList: list });
}
如果您使用第二种方法，那么EmptyList将是一个数组。如果你想EmptyList成为一个对象，那么这样做：
initialStateSet = (model) => {
const obj = {};
model.forEach(m => obj[m.key] = null);
this.setState({ EmptyList: obj });
}