Question

showAllPics(docid){

        console.log(docid)
        var newSelected = Object.assign({},this.state.CompetitorPhotos);

        console.log("b4-->",newSelected[docid]['display']);
        newSelected[docid]['display'] = true;
        console.log("after -->",newSelected[docid]['display'],newSelected);

        console.log(newSelected,this.state.CompetitorPhotos)

        this.setState({ CompetitorPhotos: newSelected },function(){
            console.log(newSelected,this.state.CompetitorPhotos)
        });

    }

我正在尝试更新＆＃39;显示＆＃39; reactjs状态的嵌套属性中的属性。以下代码失败......我做错了什么..

    console.log("after -->",newSelected[docid]['display'],newSelected);
    results in "after -->",true, newSelected.docid.display remains false

Answer 1

这里需要注意的重要事项（来自https://facebook.github.io/react/docs/react-component.html#setstate）：

setState（）并不总是立即更新组件。 可能批量或推迟更新，直到稍后。这使得阅读this.state 在调用setState（）之后就是一个潜在的陷阱。

Answer 2

您可以使用...更新嵌套状态只需看看这个问题：react set state in for nested state

return {
    ...state,
    fetching: false,
    fetched: true
}

Answer 3

很抱歉第二次回答。以下是如何在React中更新嵌套商店的示例：

    this.setState({test: {one: 'asdasdasd'}}, () => {
        let { test } = this.state
        const second = {two: 'zwei'}
        Object.assign(test, second)
        this.setState({
            test,
        }, () => {
            console.log(this.state)
        })
    })

如何更新嵌套状态的嵌套对象属性Reactjs？

3 个答案: