动作创建者数据未正确同步

Question

我有一个使用 redux thunk 的动作创建者，但发生了一些奇怪的事情

获取此代码：

export const updateShowing = name => {
    return (dispatch, getState) => {
        console.log(getState().codeToRender.contents, 'first consolelog')
        const paramFound = getState().codeToRender.contents.find(param => param.name === name)
        console.log(paramFound, 'second consolelog')
        dispatch({ type: UPDATE_SHOWING, name })
        dispatch(push(`?${updateParamHelper(getState)}`))
    }
}

当我查看第一个 console.log 时，我正在使用我正在寻找的密钥获取对象 render: true

但是第二个console.log（我所做的只是在同一个数组上查找），我得到render: false 的意思是在同一时间点由于某种原因我看到了2个不同的值，即使我我正在访问相同的getState

知道为什么会这样吗？

Answer 1

UPDATE_SHOWING 或其他操作处理程序必须处于变异状态。您的 console.logs 看起来不同，因为一个可能在记录时按原样显示元素，而另一个在展开控制台时按原样显示。

尝试在控制台中运行以下命令：

const arr = [{name:'Ben'}];
console.log('expand and name is Jerry',arr);
console.log('as is when logged:',arr[0]);
arr[0].name='Jerry';

输出示例：

expand and name is Jerry  ▼[{…}]
                            ▶ 0:{name: "Jerry"}
                              length: 1
                            ▶ __proto__: Array(0)
as is when logged: {name: "Ben"}

您可以将 console.logs 更改为：

console.log(JSON.stringify(getState().codeToRender.contents,undefined,2), 'first consolelog');

您可能会发现第一个和第二个控制台日志会记录相同的日志。