【问题标题】:[RN][Redux-Persist] AutoRehydrate is not a function[RN][Redux-Persist] AutoRehydrate 不是函数
【发布时间】:2018-01-30 04:59:34
【问题描述】:

我正在使用 redux-persist 5.5.0 当我调试我的反应原生应用程序时, 错误提示“autoRehydrate 不是功能” 我的源代码在这里,请给我帮助

"use strict";

import thunk from "redux-thunk";
import analytics from "./analytics";
import array from "./array";
import promise from "./promise";
import reducers from "../reducers";
import { createLogger } from "redux-logger";
import { applyMiddleware, createStore, compose } from "redux";
import { persistStore, autoRehydrate } from "redux-persist";
import { ensureCompatibility } from "./compatibility";
import { AsyncStorage } from "react-native";

const isDebuggingInChrome = false;

const logger = createLogger({
    predicate: (getState, action) => isDebuggingInChrome,
    collapsed: true,
    duration: true
});

const middleware = applyMiddleware(thunk, promise, array, analytics, logger);

async function configureStore(onComplete: ?() => void) {
    const didReset = await ensureCompatibility();
    const store = createStore(reducers, { /* TODO: Initial state */  }, compose(middleware, autoRehydrate()));

    persistStore(store, { storage: AsyncStorage }, _ => onComplete(didReset));

    if (isDebuggingInChrome) {
        window.store = store;
    }
    return store;
}

【问题讨论】:

    标签: reactjs react-native redux persist


    【解决方案1】:

    redux-persist 5.x 对 API 进行了更改,并且不再使用 autoRehydrate。下面是我现在使用 redux-persist 的方式。

    import React, {Component} from 'react';
    import {Provider} from 'react-redux';
    import {createStore, applyMiddleware, compose} from 'redux';
    import {PersistGate} from 'redux-persist/lib/integration/react';
    import {persistStore, persistReducer} from 'redux-persist';
    import storage from 'redux-persist/lib/storage';
    import Thunk from 'redux-thunk';
    import Router from './Router';
    import reducers from './reducers';
    
    const persistConfig = {
        key: 'root',
        storage: storage,
    };
    const persistedReducer = persistReducer(persistConfig, reducers);
    
    const store = compose(persistedReducer, {}, composeEnhancers(applyMiddleware(Thunk)));
    
    class App extends Component {
        render() {
            const persistor = persistStore(store);
            return (
                <Provider store={store}>
                    <PersistGate persistor={persistor}>
                        <Router />
                    </PersistGate>
                </Provider>
            );
        }
    }
    
    export default App;
    

    【讨论】:

      【解决方案2】:

      如果使用上述方法,会报错:Object(...) is not a function 那么尝试使用: 常量存储 = 创建存储( 持久化减速器, 应用中间件(thunk,记录器) );

      【讨论】:

      • 请在您的回答中添加一些解释
      • 在上面的代码中,在创建商店的时候,出现了一个错误:Object(...) is not a function。所以为了解决我做了这个创建商店的方法。
      • 请勿在评论中添加解释,但请修改您的答案
      猜你喜欢
      • 2022-01-06
      • 1970-01-01
      • 2021-05-15
      • 2019-12-01
      • 1970-01-01
      • 2020-02-26
      • 1970-01-01
      • 2021-05-26
      • 2020-07-12
      相关资源
      最近更新 更多