使用 connectedRouter 时 Redux 中出现意外的键、“长度”、“动作”、“位置”等

Posted 2023-03-04

【中文标题】使用 connectedRouter 时 Redux 中出现意外的键、“长度”、“动作”、“位置”等

【英文标题】：Unexpected keys, "length", "action", "location" etc in Redux when using connectedRouter

【发布时间】：2020-01-11 16:07:08

【问题描述】：

我正在尝试编写一个 React 应用程序并且我正在尝试使用 ConnectedRouter：

https://github.com/supasate/connected-react-router

它是 React Router 的 Redux 绑定。

我收到以下错误：

现在我认为这可能与这个问题的公认答案有关：

Redux: Unexpected key found in preloadedState argument passed to createStore

但与尝试传递默认值时不同的是，我实际上可能希望在我的组合减速器中使用这些。

这是我在 reducers/index.js 中的当前代码：

export default history =>
  combineReducers(
    router: connectRouter(history),
    search,
    profile,
    color,
    categories,
    coordinates: LocationReducer,
    idprovider,
    firstFavorite,
    analytics,
    sidebar,
    messages,
    total_messages,
    onesignal,
    tokens
  );

在我的 store.js 中：

import createRootReducer from "./reducers/index";

我不太确定这里的正确解决方案是什么，因为 ConnectedRouter 似乎没有对这些值做任何事情。

什么是正确的解决方案？

【参考方案1】：

编辑：在下面的示例中，我使用了 connected-react-router v4 中使用的语法，但我的示例肯定是错误的。 v5/v6 的使用有更新，如果您使用的是 version>=5，请尝试将我的示例迁移到其中： https://github.com/supasate/connected-react-router/blob/master/FAQ.md#how-to-migrate-from-v4-to-v5v6

您可能没有正确初始化存储。 试试这个：

reducers/index.js

export default combineReducers(
   // router reducer will be added automatically by connectRouter in store.js
    search,
    profile,
    color,
    categories,
    coordinates: LocationReducer,
    idprovider,
    firstFavorite,
    analytics,
    sidebar,
    messages,
    total_messages,
    onesignal,
    tokens
  );

store.js

import connectRouter, routerMiddleware from 'connected-react-router';
import createBrowserHistory from 'history';
import reducers from './reducers';

const history = createBrowserHistory(history);

const store = createStore(
    connectRouter(history)(reducers),
    applyMiddleware(routerMiddleware(history))
);