store.getState 不是 Redux-persist 函数

Question

我正在尝试在我的 React Native 应用程序上实施 Redux-persist。完全按照 setup docs，我将 store.js 更改为：

import { applyMiddleware, createStore } from 'redux';
import * as thunkMiddleware from 'redux-thunk';

import reducers from '../reducers';

let middlewares = [thunkMiddleware.default];
const store = createStore(reducers, applyMiddleware(...middlewares));

export default store;

为此：

import { applyMiddleware, createStore } from 'redux';
import * as thunkMiddleware from 'redux-thunk';
import { persistStore, persistReducer } from 'redux-persist';
import AsyncStorage from '@react-native-community/async-storage';

import reducers from '../reducers';

const persistConfig = {
    key: 'root',
    storage: AsyncStorage,
};
const persistedReducer = persistReducer(persistConfig, reducers);

let middlewares = [thunkMiddleware.default];

export default () => {
    let store = createStore(persistedReducer, applyMiddleware(...middlewares));
    let persistor = persistStore(store);
    return { store, persistor };
};

但是现在，我收到错误 TypeError: store.getState is not a function (In 'store.getState()', 'store.getState' is undefined)。

注意：我已经检查了很多关于 Whosebug 的问题，都出现了相同的 store.getState 错误，但它们有非常具体的问题，与我的设置不同。

编辑：提供商实施（使用 RNNv2）

import { Navigation } from 'react-native-navigation';
import { Provider } from 'react-redux';

import store from '../../shared/redux/store';
import { registerScreens } from '../view/screens';
import { initialize } from './navigation';

/**
 * Register screens and components for react native navigation
 */
registerScreens({ store, Provider });


const app = () => {
  Navigation.events().registerAppLaunchedListener(() => {
    initialize();
  });
};

export default app;

注册屏幕：

const registerComponentWithRedux = (redux: any) => (
  name: string,
  component: any,
) => {
  Navigation.registerComponentWithRedux(
    name,
    () => component,
    redux.Provider,
    redux.store,
  );
};

export function registerScreens(redux: any) {
  registerComponentWithRedux(redux)(screen, screen.default);
  ...
}

Answer 1

问题在于导出，您导出的是 returns 存储在密钥中的函数。因此，如果您在注册屏幕中更新商店参考，它将起作用。

import returnStoreAndPersistor from '../../shared/redux/store';

const {store} = returnStoreAndPersistor();
registerScreens({ store, Provider });

Answer 2

如果你使用来自 ../store 的 'redux-persists' 和 return{store, persistor} 试试这个!!!!!

import returnStoreAndPersistor from "../../store";

const { store } = returnStoreAndPersistor()
console.log(store.getState())

Answer 3

对于遇到此问题并且正在使用 Typescript 的任何人，其中 "getState()" 上唯一的属性是“_persist”，问题对我来说是由于将组合减速器的类型设置为 "any" 由于将您的商店提供给 persistStore 时出现类型错误：

Type AnyAction is not assignable to type {your action type}

当我解决了上述问题后，getState 问题就解决了。

我通过这样做解决了这个问题：

const _ = (state: any = 0, _: AnyAction) => state;
const root = combineReducers({
    _,
    applicationStatusReducer,
    ...
});

它似乎解决了这个问题（尽管是一种骇人听闻的方式/实际上并没有以某种方式解决潜在的问题），如果您只是向它添加一个动作类型为 "AnyAction" 的空减速器。

Answer 4

发生此问题是因为此导出默认方法而不是执行此操作可以这样做。

export let store = createStore(persistedReducer, applyMiddleware(...middleware));


export let persistor = persistStore(store);

如有不便，敬请谅解

Answer 5

const store = createStore(persistedReducer, applyMiddleware(...middlewares));
const persistor = persistStore(store);
export { store, persistor };

然后

import { store, persistor } from '../../shared/redux/store';

store.getState 不是 Redux-persist 函数

store.getState is not a function Redux-persist

reactjs

react-native

react-redux

react-native-navigation

redux-persist