Redux-persist не сохраняется с экспо при перезагрузке - PullRequest
Новая
       102

Redux-persist не сохраняется с экспо при перезагрузке

1 голос
/ 09 июля 2020

Я использую следующий технический стек

  1. react-native
  2. expo
  3. redux
  4. redux-persist.

Я пробовал здесь статьи, документы и вопросы, но это не помогло. Его просто не существует. Я использую эмулятор и использую только выставку. Как только я закрываю приложение и перезагружаю клиент 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 };

приложение. 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 };

1 Ответ

1 голос
/ 10 июля 2020

Я исправил. Его нет ни в какой документации или статье. Проблема заключается в persistConfig . Ключ , который здесь root. Это должно быть имя редуктора, который мы хотим сохранить. В моем случае это было auth .

Обновлено persistConfig будет выглядеть следующим образом: 

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