javascript - React Redux 不会重置某些组件的存储

Question

我的 redux store 有一个奇怪的问题: 我可以在我的应用程序中设置它，但我想在注销时将它重置为组件 initialState。 似乎没有任何东西在这个特定的组件上工作。在其他组件中，root reducer 方法有效。这是一个比较大的项目，但我很确定，我的组件逻辑和工作组件是一样的。

reducer 看起来像这样:

const initialState = {
    myList: [
        {
          key: 'ListKey1',
          formats: [],
          selectedFormat: '',
          printer: {},
        },
        {
          key: 'ListKey2',
          active: false,
          formats: [],
          selectedFormat: '',
          printer: {},
        },
        {
          key: 'ListKey3',
          active: false,
          formats: [],
          selectedFormat: '',
          printer: {},
        },
      ],
};


export default function myReducer(state = initialState, action) {
  switch (action.type) {
    ...
    ...
    default:
      return state;
  }
}

我尝试了 rootReducer 方法:

const rootReducer = (state, action) => {
    if (action.type === 'LOGOUT') {
      return appReducer(undefined, action);
    }

    return appReducer(state, action);
  };

这似乎根本没有触及 initialState。

我也尝试过“老式”的方式，通过在 reducer 中捕获注销案例。 这也没有做任何事情。

    ...
    case 'LOGOUT':
        return initialState;
    default:
        return state;
    ...

当我用一个空数组替换 initialState 时，它​​会工作/覆盖状态。

    ...
    case 'LOGOUT':
        return [];
    default:
        return state;
    ...

但这当然不适合我的应用

也许这里的任何人都可以提供帮助，你是我最后的选择，谷歌搜索没有太大帮助。 干杯! :D

更新:

这是我的mapStateToProps

const mapStateToProps = (state) => ({
  selectedList: state.settings.myList,
});

Answer 1

仅当您对数据有不同的引用时，组件才会重新呈现。例如您的初始值将在开始时设置，然后如果您再次将存储值设置为初始值(同一个对象)，组件将不会重新渲染。您只需要更新引用。

case 'LOGOUT':
   return { myList: [...initialState.myList ] };
default:
   return state;