Redux-persist 在重新加载时不坚持 expo

Question

我正在使用以下技术栈

1. 本机反应
2. 博览会
3. redux
4. redux-persist.

我也尝试过这里的文章、文档和问题，但没有帮助。它根本没有坚持。我仅通过 expo 使用模拟器和 运行。一旦我关闭应用程序并重新加载 expo 客户端，它就不会持续存在并要求我再次登录。 我也尝试使用 AsyncStorage 但仍然无法正常工作。

她的是我的密码：

index.js

import thunk from "redux-thunk";
import AsyncStorage from "@react-native-community/async-storage";
import ExpoFileSystemStorage from "redux-persist-expo-filesystem"
// import storage from 'redux-persist/lib/storage';
import { createStore, applyMiddleware, compose } from "redux";
import { persistStore, persistReducer } from "redux-persist";

import rootReducer from "./reducers/rootReducer";
import logger from "redux-logger";

const persistConfig = {
  key: "root",
  storage: ExpoFileSystemStorage,
  whitelist: ["authReducer"],
};

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const persistedReducer = persistReducer(persistConfig, rootReducer);

const store = createStore(
  persistedReducer,
  composeEnhancers(applyMiddleware(thunk, logger))
);

let persistor = persistStore(store);

export { store, persistor };

app.js

import React from "react";
import { Provider } from "react-redux";
import { PersistGate } from "redux-persist/integration/react";
import { AppLoading } from "expo";
import { useFonts } from "@use-expo/font";
import { NavigationContainer } from "@react-navigation/native";
import { ThemeProvider } from "react-native-elements";

import { theme } from "./constants/ThemeConfiguration";
import { store, persistor } from "./store";
import RootNavigator from "./navigators/RootNavigator";


export default (App) => {
  let [fontsLoaded] = useFonts({
    "Lato-Regular": require("./assets/fonts/Lato-Regular.ttf"),
  });

  if (!fontsLoaded) {
    return <AppLoading />;
  } else {
    return (
      <Provider store={store}>
        <PersistGate loading={null} persistor={persistor}>
          <ThemeProvider theme={theme}>
            <NavigationContainer>
              <RootNavigator />
            </NavigationContainer>
          </ThemeProvider>
        </PersistGate>
      </Provider>
    );
  }
};

rootReducer.js

import thunk from "redux-thunk";
import AsyncStorage from "@react-native-community/async-storage";
import { createStore, applyMiddleware, compose } from "redux";
import { persistStore, persistReducer } from "redux-persist";

import rootReducer from "./reducers/rootReducer";
import logger from "redux-logger";

const persistConfig = {
  key: "auth",
  storage: AsyncStorage,
};

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const persistedReducer = persistReducer(persistConfig, rootReducer);

const store = createStore(
  persistedReducer,
  composeEnhancers(applyMiddleware(thunk, logger))
);

let persistor = persistStore(store);

export { store, persistor };

Answer 1

我修好了。它不存在于任何文档或文章中。问题出在 persistConfig。 Key 这里是root。它应该是我们想要保留的减速器的名称。在我的例子中是 auth.

更新后的 persistConfig 将如下所示：

const persistConfig = {
  key: "auth",
  storage: AsyncStorage,
};