Redux使用者未将更新的道具传递给React组件

Question

redux@6.0.0

我正在努力将redux添加到服务器端渲染的React应用程序。该应用程序的体系结构是一个黑匣子，但我已经成功set up redux following this example from the docs。

我可以从redux存储中读取数据并将其呈现在屏幕上。我可以调度更新商店的动作。这些更改会滴加到Context.Consumer（可以在React DevTools中进行验证），但要停在那里。尽管有更改，但初始安装后该值永远不会传递给组件。

I read here that "99.9% of the time" this is due to mutating state。所以我添加了另一个带有样板值的商店，并采取行动对其进行了更新：

const ACTIONS = {
    SET_RANDOM_TEST_VALUE: 'SET_RANDOM_TEST_VALUE',
}

const initialState = {
    testValue: 'intial test value', // I now see this typo, but the screenshots are final ?‍♂️
}

export const setRandomTestValue = () => ({
    type: ACTIONS.SET_RANDOM_TEST_VALUE,
})

export const reducer = (state = initialState, action) => {
    switch (action.type) {
        case ACTIONS.SET_RANDOM_TEST_VALUE: {
            return {
                ...state,
                testValue: String(Math.random()).slice(-5),
            }
        }
        default: {
            return state
        }
    }
}

我的测试简化程序已添加到rootReducer：

import { reducer as testReducer } from './TestStore.redux'

const rootReducer = combineReducers({
    // ...
    __test__: testReducer,
})

然后将值映射到组件：

/* Import assets */

const Test = props => {
    console.count('Render count')
    return (
        <div>
            <button onClick={props.setRandomTestValue}>Update value</button>
            <code>{props.testValue}</code>
        </div>
    )
}

export default connect(
    state => ({ testValue: state.__test__.testValue }),
    { setRandomTestValue }
)(Test)

通过此设置，一切似乎都可以正常工作。控制台记录Render count: 1，并且组件显示initial test value －均符合预期：

当您单击按钮时，将触发操作并更新商店（如redux logger中所示）：

但是，该组件不会再次被调用，内容也不会更改：

在React DevTools中对其进行跟踪，您可以看到Context.Consumer确实具有更新后的值（数字的随机字符串）：

^^^不同的值，因为屏幕截图很难。

因此，价值体现在消费者身上，但就其价值而言。当您检查Test组件的道具时，它仍然具有初始值：

:sad-trombone:

tl; dr

在该项目中的某个地方，redux商店的消费者与期望更新道具的组件之间存在细目分类。该组件可以从存储中读取初始值，但是无法接收更新。

由于该项目的复杂性，我并不是在寻找答案本身。我只需要知道朝哪个方向看。任何提示将不胜感激。