Question

我需要访问redux存储数据和反应组件外部的调度函数（在utils函数中）

我使用React Native，Redux，Redux Saga，Redux Persist。我的配置存储文件如下所示：

//create the saga middleware
const sagaMiddleware = createSagaMiddleware();

const encryptor = createEncryptor({
secretKey: 'encryptor_key',
  onError(error) {
  console.log('Encryptor error', error);
  // Handle the error.
 },
});

const persistConfig = {
   key: 'root',
   storage,
   transforms: [encryptor],
   whitelist: ['user', 'etc'],
};

const persistedReducer = persistReducer(persistConfig, rootReducer);

export default () => {
   const store = createStore(persistedReducer, applyMiddleware(sagaMiddleware));
const persistor = persistStore(store);

sagaMiddleware.run(rootSaga);
 return { store, persistor };
};

用户登录后，我在redux中的用户reducer中保存用户信息和oath2令牌，并使用Redux Persist保存。 App.js就像下面的代码：

 import configureStore from './services/configureStore';
 const { store, persistor } = configureStore();

 render() {
  return (
    <Provider store={store}>
       <PersistGate loading={<Loading style={{ flex: 1 }} />} persistor={persistor}>
        <AppNavigator />
      </PersistGate>
    </Provider>
  );
}

现在，在api.js中我需要访问用户令牌。我需要在每个axios请求之前检查oauth2令牌过期时间。在axios发送请求之前我调用了setHeader函数。我在api.js中的代码如下所示：

import configureStore from './configureStore'; //import config store

function setHeader(){
    const { store, persistor } = configureStore();
    console.log('store is:', store.getState())
}

当我调用setHeader函数时，console.log show store为空，而不是show redux store data。有人可以帮忙吗？

Answer 1

您正在App.js中创建商店，因此只需从那里导出商店：

const { store, persistor } = configureStore();

export {store}

之后您只需导入商店就可以访问任何商店：

import {store} from ./???/App.js

Answer 2

我相信您可以访问Provider和App.js文件中的Store。如果我们将setHeader视为redux的操作，您只需使用以下代码来获取状态：

function setHeader() { //Thunk Action
    return (dispatch, getState) => {
        console.log(getState())
    }
}

获取商店数据和调度外部组件反应原生

2 个答案: