Redux RTK API Slice 内的调度操作

Question

我想知道是否可以从 Redux RTK 的

API Slice

中的另一个减速器分派一个动作。假设我有这个

getSomething: builder.query<SomeProps, void>({
        query: () => ({
            url: "...",
            headers: {
                'Content-Type': 'application/json',
            }
        }),

是否有可能有像

onSuccess

这样的东西（假设

getSomething()

返回

200

/任何解决成功的东西）

getSomething: builder.query<SomeProps, void>({
        query: () => ({
            url: "...",
            headers: {
                'Content-Type': 'application/json',
            }
        }),
        onSuccess: (response: SomeProps, {dispatch}) => {
            dispatch(someActionFromAnotherReducer(response))
        }

Answer 1

您可以使用

onQueryStarted

来做到这一点

当您开始每个单独的查询或突变时调用的函数。使用包含 queryFulfilled 等属性的生命周期 api 对象调用该函数，允许在查询启动、成功和失败时运行代码（即在单个查询/突变调用的整个生命周期中）。

import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query'
import { messageCreated } from './notificationsSlice'

export interface Post {
  id: number
  name: string
}

const api = createApi({
  baseQuery: fetchBaseQuery({
    baseUrl: '/',
  }),
  endpoints: (build) => ({
    getPost: build.query<Post, number>({
      query: (id) => `post/${id}`,
      async onQueryStarted(id, { dispatch, queryFulfilled }) {
        // `onStart` side-effect
        dispatch(messageCreated('Fetching post...'))
        try {
          const { data } = await queryFulfilled
          // `onSuccess` side-effect
          dispatch(messageCreated('Post received!'))
        } catch (err) {
          // `onError` side-effect
          dispatch(messageCreated('Error fetching post!'))
        }
      },
    }),
  }),
})