React Redux - 将多个存储增强器传递给 createStore() 时出错 [英] React Redux - Error passing several store enhancers to createStore()

问题描述

我有一个运行 redux 和 thunk 的 React 应用程序，一切正常.我需要在页面重新加载时保持存储状态，以便数据不会丢失，因此创建了一个将数据存储在 localstorage 中的函数，然后返回准备添加到 createStore 的数据(https://stackoverflow.com/a/45857898/801861).数据存储工作正常并返回准备设置状态的对象.在 createStore 中添加数据对象时，反应无法编译并出现此错误:

I have a react app running redux and thunk which has all been working fine. I need to persist the store state on page reload so that data is not lost, so have created a function which is storing data in the localstorage and then returning the data ready for adding to createStore (https://stackoverflow.com/a/45857898/801861). The data storage is working fine and returning the object ready for setting the sate. When adding the data object at createStore react fails to compile with this error:

错误:看起来您正在将多个商店增强器传递给 createStore().这不受支持.相反，将它们组合成一个函数

Error: It looks like you are passing several store enhancers to createStore(). This is not supported. Instead, compose them together to a single function

这是当前代码返回错误:

Here is CURRENT CODE RETURNING ERROR:

const store = createStore(reducers, LoadState, applyMiddleware(thunk) );

//Error: It looks like you are passing several store enhancers to createStore(). This is not supported. Instead, compose them together to a single function

我正在运行的原始代码:

My original code which was running:

const store = createStore(reducers, applyMiddleware(thunk) );

我尝试在网上发现的一些类似问题之后修复此问题，编译但破坏了最初运行良好的站点代码:

I attempted to fix this following some similar issues I found online, compiles but breaks site code which was originally working fine:

const composeEnhancers = LoadState || compose;
const store = createStore(reducers, composeEnhancers( applyMiddleware(thunk) ) );
//Error: Actions must be plain objects. Use custom middleware for async actions.

不确定我需要更改什么才能使其正常工作，感谢您的帮助.

Not sure what I need to change to get this to work, any help is appreciated.

推荐答案

我认为您正在学习一个在以前版本的 redux 中执行任务的教程.

I think you are following a tutorial which is performing tasks in a previous version of redux.

您需要创建一个 composeEnhancer，它将接收您的 Redux Dev Tools 扩展，如图所示

You need to create a composeEnhancer which will take in your Redux Dev Tools extension as shown

const composeEnhancer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

从 'redux' 导入 compose 后显然如图所示 -

after importing compose from 'redux' obviously as shown -

import {createStore, compose, applyMiddleware} from 'redux';

然后，您可以创建如图所示的商店 -

and then, you can create the store as shown -

const Store = createStore(rootReducer, composeEnhancer(applyMiddleware(thunk)))

这篇关于React Redux - 将多个存储增强器传递给 createStore() 时出错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！