reactjs - React Native 和 Redux : Require cycle (how to get rid of it? )

Question

在开发新 RN 应用程序的主干时，我发现自己处于以下代码状态:

• src/redux/index.ts(构建和导出存储的人)导入 rootReducer 文件，以使用它来configureStore。<

const persistedReducer = persistReducer(persistConfig, rootReducer);
const store = configureStore({
  reducer: persistedReducer,
  /* middleware definitions */
});

• rootReducer 导入 userReducer 以使用 combineReducers 将其添加到化简器列表中。

const rootReducer = combineReducers({
  /* some reducers */
  user: userReducer,
});

• userReducer 导入 serverApi 以便能够使用 thunk 进行 api 调用。

export const registerUser = createAsyncThunk(
  'user/register',
  async ({ country, number }: loginDataType) => {
    const response = await serverApi.post('/register', { country, number });
    return response.data;
  },
);

• serverApi 导入 store 以从用户处获取 token 并将其设置在 Axios 拦截器中。

instance.interceptors.request.use(
  async config => {
    const { token } = store.getState().user;
    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
    }
    return config;
  },
);

正如我所说，商店导出到 src/redux/index.ts 中。就这样，这就是循环。 React 向我发出警告，比如，来吧，别这样做。我哪里做错了或者我可以做些什么不同的事情？

Answer 1

所以，文档实际上给出了这个用例的答案。

https://redux.js.org/faq/code-structure#how-can-i-use-the-redux-store-in-non-component-files

基本上，我们不是在 api 文件中导入存储，而是从存储文件本身注入(inject)它:

export const injectStore(_store) {
  store = _store
}

并在商店文件中:

injectStore(store);