Redux Toolkit中useGetCryptosQuery非函数错误排查求助

1. 端点名称拼写错误（直接触发报错） #

你的API定义代码中，endpoints里的端点名称写成了gerCryptos（漏写了字母t）。RTK Query会根据端点名称自动生成对应的Hook，正确名称应为getCryptos，这样才会生成可用的useGetCryptosQuery Hook。

2. Store缺失RTK Query必需的中间件 #

使用RTK Query时，必须将其对应中间件添加到Redux Store中，否则请求逻辑无法正常执行，即便Hook修正后也无法获取数据。

修正后的代码 #

API代码（cryptoApi.js）

import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';

const cryptoApiHeaders = {
  'X-RapidAPI-Key': 'key',
  'X-RapidAPI-Host': 'host'
}

const baseUrl =  'https://coinranking1.p.rapidapi.com';

const createRequest = (url) => ({ url, headers: cryptoApiHeaders});

export const cryptoApi = createApi({
  reducerPath: 'cryptoApi',
  baseQuery: fetchBaseQuery({ baseUrl }),
  endpoints: (builder) => ({
    // 修正拼写错误：gerCryptos → getCryptos
    getCryptos: builder.query({
      query: () => createRequest('/coins')
    })
  })
});

export const {
  useGetCryptosQuery,
} = cryptoApi;

Store代码（store.js）

import { configureStore } from '@reduxjs/toolkit';
import { cryptoApi } from '../services/cryptoApi';

export default configureStore({
  reducer: {
    [cryptoApi.reducerPath]: cryptoApi.reducer,
  },
  // 添加RTK Query中间件
  middleware: (getDefaultMiddleware) =>
    getDefaultMiddleware().concat(cryptoApi.middleware),
});

内容的提问来源于stack exchange，提问作者Kariko