2

我已经在我的应用程序中插入了 redux-persist。当应用程序被杀死后重新启动时,我想做的第一个想法是在重新水化的商店中获取我的身份验证令牌并检查令牌是否仍然有效。

我正在努力寻找做到这一点的好策略。作为第一个直觉,我会尝试在 componentDidMount 方法的根 App 组件中执行此操作。这是我的组件:

export default class App extends React.Component {
  componentDidMount(){
    console.log('in app componentDidmount')
    console.log(store.getState())
    console.log(persistor.getState())
  }

  render() {
    return (
      <Provider store={store}>
        <PersistGate persistor={persistor}>
          <Router />
        </PersistGate>
      </Provider>
    );
  }
}

但是store.getState()给了我非再水合状态并persistor.getState()给了我一个不可用的对象:

{ bootstrapped: false, registry: ["root"] }

这也是我的store.js文件:

const persistConfig = {
  key: 'root',
  storage: AsyncStorage,
  stateReconciler: autoMergeLevel2, // see "Merge Process" section for details.
  blacklist: ['error', 'loading', 'backgroundImage'],
};
const pReducer = persistReducer(persistConfig, reducers);

export const store = createStore(pReducer, {}, compose(applyMiddleware(ReduxThunk)));

export const persistor = persistStore(store);

我怎样才能做到这一点?

4

2 回答 2

3

方法一

在以下回调中执行persistStore

export const persistor = persistStore(store, null, () => {
  console.log('state', store.getState());
});

方法二

componentDidMount嵌套的组件中执行此操作PersistGate

class Main extends React.Component {
  componentDidMount() {
    console.log(store.getState());
  }
  render() {
    return <Router />;
  }
}

const App = () => (
  <Provider store={store}>
    <PersistGate persistor={persistor}>
      <Main />
    </PersistGate>
  </Provider>
);
于 2018-07-30T10:00:20.683 回答
0

我在这里为您提供了一篇 Medium 文章的链接,该文章准确地解释了您想要构建的内容。

我现在帮不了你,因为我需要更多的代码片段,因为它可以与 Redux 一起使用。

希望本文对您有所帮助:https ://medium.com/@alexmngn/the-essenSharryUptial-boilerplate-to-authSharryUpenticate-users-on-your-react-native-app-f7a8e0e04a42

于 2018-08-02T12:53:39.013 回答