如何将createEntityAdapter应用于createApi片

Question

我已经成功地实现了一个redux-toolkit api。现在，我试图使用createEntityAdapter来使用预先构建的选择器方法。

import {
  createEntityAdapter,
  createSelector,
} from '@reduxjs/toolkit'
import api from '@app/redux/reducers/api'

const environmentsAdapter = createEntityAdapter()
const initialState = environmentsAdapter.getInitialState()

export const extendedApiSlice = api.injectEndpoints({
  endpoints: (builder) => ({
    getEnvironments: builder.query({
      query: ROUTES.ENVIRONMENTS,
      // IMPORTANT
      transformResponse: (responseData: any) => {
        return environmentsAdapter.setAll(environmentsAdapter.getInitialState(), responseData)
      },
    }),
  }),
})

// Default api slice hooks
export const {
  useGetEnvironmentsQuery, // data returns the normalized data correctly
  usePostEnvironmentMutation
} = extendedApiSlice

export const selectEnvironmentsResult = extendedApiSlice.endpoints.getEnvironments.select()

const selectEnvironmentResultData = createSelector(
  selectEnvironmentsResult,
    environmentResult => {
    console.log(environmentResult) // {status: "uninitialized", isUninitialized: true, isLoading: false, isSuccess: false, isError: false}
    return environmentResult?.data ?? []
  }
)

export const {
  selectAll: selectAllEnvironments, // returns an empty array, ERROR!
} = environmentsAdapter.getSelectors(state => {
  console.log( state ) // Here the entire redux state is printed, ERROR?
  return selectEnvironmentResultData(state) ?? initialState
})

当使用useGetEnvironmentsQuery钩子时，我会正确地得到数据。但是当我使用selectAllEnvironments时，我会得到一个空数组。为什么？

Answer 1

这个问题解决了改变useGetEnvironmentsQuery参数的问题。我取代了：

  const { isLoading, isFetching, error } = useGetEnvironmentsQuery({}) // WITH EMPTY OBJECT
  const data = useSelector(selectAllEnvironments)
  console.log( data ) // empty array

至：

  const { isLoading, isFetching, error } = useGetEnvironmentsQuery() // WITH NO ARGS
  const data = useSelector(selectAllEnvironments)
  console.log( data ) // data is defined here finally :)

不确定到底发生了什么