Question

我有处于类状态的对象。

man: {
name: "John",
wife: [{"children": 2}, {"children": 3}]
}
this.setState(prevState => ({man: prevState.wife[0].children + 1}));

我想增加或减去第一任妻子的孩子数量。我使用prevState，但是不起作用。为什么以及如何更改此属性？

Answer 1

进入man属性之前，您需要访问wife属性。因为wife属性位于man属性之内。

let obj = {
man: {
name: "John",
wife: [{"children": 2}, {"children": 3}]
}
}

console.log(obj.man.wife[0].children)

Answer 2

您的旧状态：

{
    man: {
        name: "John",
        wife: [{"children": 2}, {"children": 3}]
    }
}

您正在返回新状态：

{
    man: 3
}

如果您需要保留相同的状态结构，则解决方案可以是：

this.setState(prevState => ({
    man: {
        ...prevState.man,
        wife: prevState.man.wife.map((value, i) => (i === 0 ? {
            ...value,
            children: value.children + 1
        } : value)),
    }
}));

但是使用lodash/fp update或Ramda over通常更容易进行此类修改：

this.setState(prevState => R.over(
    R.lensPath([`man`, `wife`, 0, `children`]),
    (v) => v + 1,
    prevState,
));

Answer 3

尝试一下；

this.setState((prevState) => ({man: prevState.man.wife[0].children + 1}));

因为您缺少州名man

反应中的上位对象

3 个答案: