时间戳

首页 > 解决方案 > extraReducers 执行的顺序是什么，在 reducer 之前还是之后？

javascript - extraReducers 执行的顺序是什么，在 reducer 之前还是之后？

问题描述

来自 redux-toolkit 的 createSlice：https ://redux-toolkit.js.org/api/createslice

我想知道 extraReducers 是在减速器之前还是之后执行的。或者如果无法确定执行顺序。

这是一个人为的例子：
在调用 increment 之后，能否确定累积值是多少？

const count = createSlice({
  name: 'count',
  initialState: {
    count: 0,
    accumulate: 0,
  },
  reducers: {
    increment: (state) => {
      state.count += 1;
    },
  },
  extraReducers: (builder) => {
    builder
      .addMatcher(
        (action) => {
          return action.type === count.actions['increment'].type;
        },
        (state, action) => {
          state.accumulate += state.count;
        }
      )
  },
});

在普通的 redux reducer 中，很容易强制执行这样的命令：

const initialState = {
  count: 0,
  accumulate: 0
};

export default function reducer(state = initialState, action) {
  let { count, accumulate } = state;
  switch (action.type) {
    case "INCREMENT": {
      count += 1;
    }
  }

  accumulate += count;
  return {
    count,
    accumulate
  }
}

标签： javascriptreactjsreduxreact-reduxredux-toolkit

解决方案

真的没关系。默认案例仅在没有其他案例匹配时执行每个文档，因此它们永远不能同时执行。

https://redux-toolkit.js.org/api/createReducer#builderadddefaultcase

builder.addDefaultCase
添加一个“默认案例”reducer，如果没有为此操作执行 case reducer 和 matcher reducer，则执行该 reducer。

推荐阅读