javascript - 从 Reducer 函数中访问 Redux 中的 Store 状态

Question

我有一个包含多个 reducer /状态的组合 reducer 。看起来如下

const reducer = combineReducers({
  blogs: blogReducer,
  notification: notificationReducer,
  search: searchReducer,
  filter: filterReducer,
  users: userReducer,
  loggedUser: loginReducer
});

const store = createStore(reducer, composeWithDevTools(applyMiddleware(thunk)));

在我的 userReducer 文件中，我想从一个函数中访问博客状态

这是为了在保存新博客文章时更新我的​​用户状态。

我已经试过了:

import store from "../store";
const { blogs } = store.getState().blogReducer.blogs;

还有这个

const { blogs } = store.getState().blogs;

但都没有用

最后，在一篇新的博客文章中，我调用了一个 createBlog Action 创建者和一个 updateUser Action 创建者。我的用户与我的博客模型存在一对多关系。我想我需要更新用户的状态以包括新创建的博客，我想我可以只获取当前的博客状态，找到用户，然后用更新后的状态替换他们的博客。

类似这样的事情，但也难住了其中的一部分。

const userReducer = (state = [], action) => {
      switch (action.type) {
        case "NEW_USER":
          return [...state, action.data];
        case "UPDATE_USER":
          const { blogs } = state;
          console.log("Blogs", blogs);
          const username = action.data.id.username;
          const userBlogs = blogs.filter(b => b.user.username === username);
          const userToChange = state.find(a => a.username === username);
          const changedUser = userToChange.blogs.replace(userBlogs);
          return state.map(user =>
            user.username !== username ? user : changedUser
          );

export const updateUser = (id, blog) => {
  return async (dispatch, getState) => {
    const { blogs } = getState();
    dispatch({
      type: "UPDATE_USER",
      data: {
        id: id,
        data: blog,
        blogs
      }
    });
  };
};

Answer 1

Redux 文档中有一个 FAQ 部分是关于这个问题的: https://redux.js.org/faq/reducers#how-do-i-share-state-between-two-reducers-do-i-have-to-use-combinereducers

你可以使用 reduce-reducers例如:

// In this reducer, the state argument represents your root state
// Here you can handle actions which need to access multiple slice of the root state
const specializedReducer = (state, action) => {
  switch (action.type) {
    case "UPDATE_USER":
      const { blogs, users } = state;
      // proceed with your code here
  }
}

const reducer = combineReducers({
  blogs: blogReducer,
  notification: notificationReducer,
  search: searchReducer,
  filter: filterReducer,
  users: userReducer,
  loggedUser: loginReducer
});

const rootReducer = reduceReducers(specializedReducer, reducer);

const store = createStore(rootReducer, composeWithDevTools(applyMiddleware(thunk)));