【问题标题】:React context object does not seem to be updating properly again [duplicate]反应上下文对象似乎没有再次正确更新[重复]
【发布时间】:2021-10-15 14:23:54
【问题描述】:

我正在尝试在我的组件中使用上下文 API 对象并更新相同的上下文对象两次(一次在初始组件加载期间,另一次在单元格单击时)

由于某种原因,当我在单元格单击时更新它并控制台输出值时,它仍然具有较早的值,即加载期间设置的较早值。这是为什么呢?

我的期望是上下文对象应该在单击单元格时被新值完全覆盖。

下面是我的相关代码;

const [data, setData] = React.useContext(DataContext);

useEffect(() => {
        if (props.someThing) {
            setData({
                attr1: '1',
                attr2: '2'
            })
        }
    
}, [data.attr1]);

const onCellClick = (e) => {
    console.log(e);
    if (data.attr1 === '1') {
        setData({
            newAttrPostClick1: '3',
            newAttrPostClick4: '4'
        });
        console.log("data : " + JSON.stringify(data)); // This is printing {attr1: '1',attr2: '2'} and not {newAttrPostClick1: '3',newAttrPostClick4: '4'}
        history.push("/SomePage");
    }
}

【问题讨论】:

  • 请注意,我们更喜欢这里的技术写作风格。我们轻轻地劝阻问候,希望你能帮助,谢谢,提前感谢,感谢信,问候,亲切的问候,签名,请你能帮助,聊天材料和缩写 txtspk,恳求,你多久了被卡住、投票建议、元评论等。只需解释您的问题,并展示您尝试过的内容、预期的内容以及实际发生的情况。

标签: reactjs react-hooks react-context use-context


【解决方案1】:

这是完全正常的,你不能指望console.logsetData 之后立即执行具有最新值,出于性能原因以async 方式响应调度值,如果你仍然想确定你有你想要的最新值,要么在你的组件中显示它,要么使用useEffect 来控制台它,它会控制台最新的值

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-03-05
    • 2018-04-14
    • 2021-03-21
    • 2023-03-07
    • 1970-01-01
    相关资源
    最近更新 更多