React 状态对象属性被设置为未定义答案

【问题标题】：React state object attribute is getting set as undefinedReact 状态对象属性被设置为未定义
【发布时间】：2022-11-30 10:42:17
【问题描述】：

我初始化了以下状态对象，称为 myCriteria

const [myCriteria, setMyCriteria] = useState({
    myFieldStatusDropdown: myFieldStatusDropdown,
    selectedMyFieldStatus: myVarMyFieldStatusDropdown?.value,
});

现在我在这条线的正上方设置了断点

setMyCriteria({
    ...myCriteria,
    selectedMyFieldStatus: myCriteria.myFieldStatusDropdown[0]
});

在断点处，我检查并查看 myCriteria.myFieldStatusDropdown 如下

[
{
    code: 'Select',
    value: 'Select'
}, {
    code: 'AA',
    value: 'A 1'
}, {
    code: 'BB',
    value: 'B 1'
}
]

但是由于某些奇怪的原因，在执行 setMyCriteria 行之后，当我检查 myCriteria.selectedMyFieldStatus 的值时，它是错误的即，而不是将其设置为

{
    code: 'Select',
    value: 'Select'
}

它被设置为未定义

不确定为什么它被设置为未定义

【问题讨论】：

你在哪里变得不确定？
在执行 setter 代码行后，我得到 myCriteria.selectedMyFieldStatus 未定义
这是因为 setMyCriteria 是异步的，以查看状态更改是否使用 useEffect
请分享 minimal reproducible example 而不是脱离上下文而无法执行的小 sn-ps。您可能应该在 setter 中使用箭头函数。

标签： javascript reactjs react-hooks

【解决方案1】：

尝试这种方式来解决您的问题，我只是使用 myCriteria 进行初始化并以数组的形式将三个对象放入其中。

 var myFieldStatusDropdown = [
    {
        code: 'Select',
        value: 'Select'
    }, {
        code: 'AA',
        value: 'A 1'
    }, {
        code: 'BB',
        value: 'B 1'
    }
]

 const [myCriteria, setMyCriteria] = useState({
    myFieldStatusDropdown: myFieldStatusDropdown,
    selectedMyFieldStatus: myFieldStatusDropdown[1]
});

然后我使用 setMyCriteria 函数来更新 myCriteria

 setMyCriteria({
    ...myCriteria,
    selectedMyFieldStatus: myFieldStatusDropdown[0]
},[myCriteria]);

问候，

saurav bhooriya（REACT NATIVE 实习生）

在 BookySure.com (https://bookysure.com)

【讨论】：