在 redux-toolkit 切片中捕获所有待处理或拒绝的操作

Question

Aight.. 所以我对 redux 工具包很陌生，我想在一个切片中捕获所有未决操作以基本上显示加载模式。我知道我们可以用 redux-saga 来做到这一点，可能 redux-observable

Soooooo 而不是

 builder.addCase(fetchUsers.pending, (state) => {
      state.loading = LoadingState.PENDING;
 });

像这样的东西

 builder.addCase(allActions.pending, (state) => {
      state.loading = LoadingState.PENDING;
 });

我知道 allActions 在那里不起作用，但有什么可以。

Answer 1

您可以使用 the matching utilities included in RTK:

import { createSlice, isPending} from "@reduxjs/toolkit";

const dataSlice = createSlice({
  name: "data",
  reducers: { /* */ },
  extraReducers: builder => {
    builder.addMatcher(isPending, (state, action) => {
      // logic here
    })

  }
})

您还可以以各种方式组合匹配的实用程序，以仅处理特定 thunk 等的挂起状态。

在 redux-toolkit 切片中捕获所有待处理或拒绝的操作

Catch all Pending or Rejected actions within a redux-toolkit slice

redux

redux-saga

redux-observable

redux-toolkit