Question

我正在制作一个使用redux和redux-persist的react本机应用程序。

实际行为：当用户登录并关闭apen并在一段时间后重新打开时，他应该直接进入登录视图。但是在我的应用程序中，首先登出登出页面，在商店重新水化后，它会自动重定向到登录视图

App.js如下

 // all other import statements
 const { store } = configureStore({});

 class App extends Component {
   constructor() {
    super();
    this.state = {
    isReady: false,
  };
}

render() {
 const { isLoggedIn } = store.getState().auth;
 const Layout = CreateRootNavigator(isLoggedIn);

  return (
    <Provider store={store}>
      <AlertProvider>
        <Root>
          <Layout />
       </Root>
      </AlertProvider>
    </Provider>
  );
 }
}

我的createStore.js如下所示，它使用redux-persist v5

function configureStore(initialState) {
  let store = createStore(
       persistedReducer,
       initialState,
      compose(applyMiddleware(...middlewares))
    );

  let persistor = persistStore(store);
  // send this persistor also

  return { store };
}

我面临的问题是，当我登录并关闭应用程序然后重新打开时，弹出的对话框屏幕会弹出，并在商店重新水化后自动重定向到登录布局。我可能想要一个标志或商店被重新水化后的东西，以便我可以实际渲染商店被重新水化后的实际东西。请帮助...提前感谢

Answer 1

在docs中明确提到，您应该使用PersistGate来延迟UI组件的呈现。

如果您正在使用react，请使用PersistGate包装您的根组件。这会延迟应用程序UI的呈现，直到检索到持久状态并将其保存到redux。注意 PersistGate loading prop可以为null，也可以是任何反应实例，例如loading={<Loading />}

Redux坚持v5没有按预期工作

1 个答案: