使用redux工具箱和RTK-Query获取一个获取错误

Question

我正在为这个应用程序使用RTK-Query和Redux-工具箱，并根据文档使用createApi创建了一个api-片。

当我向后端运行请求时，我得到一个"FETCH_ERROR"；然而，当我使用Axios运行相同的请求时，我从后端正确地获得数据，这使我相信我的代码中有一个错误。我只是不知道它到底在哪里。

以下是错误：

Object {
  "api": Object {
    "config": Object {
      "focused": true,
      "keepUnusedDataFor": 60,
      "middlewareRegistered": true,
      "online": true,
      "reducerPath": "api",
      "refetchOnFocus": false,
      "refetchOnMountOrArgChange": false,
      "refetchOnReconnect": false,
    },
    "mutations": Object {},
    "provided": Object {},
    "queries": Object {
      "test(undefined)": Object {
        "endpointName": "test",
        "error": Object {
          "error": "TypeError: Network request failed",
          "status": "FETCH_ERROR",
        },
        "requestId": "BWOuLpOxoDKTzlUYFLW4x",
        "startedTimeStamp": 1643667104869,
        "status": "rejected",
      },
    },
    "subscriptions": Object {
      "test(undefined)": Object {
        "QJSCV641RznGWyudGWuMb": Object {
          "pollingInterval": 0,
          "refetchOnFocus": undefined,
          "refetchOnReconnect": undefined,
        },
      },
    },
  },
  "test": Object {
    "data": Array [],
  },
}

下面是测试切片：

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

const testSlice = createSlice({
  name: "test",
  initialState: {
    data: [],
  },
  reducers: {
    getData: (state) => {
      state;
    },
  },
});

export const { getData } = testSlice.actions;
export default testSlice.reducer;

下面是apiSlice：

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

export const apiSice = createApi({
  reducerPath: "test",
  baseQuery: fetchBaseQuery({ baseUrl: process.env.REACT_APP_backend_url }),
  endpoints: (builder) => ({
    test: builder.query({
      query: () => "/test",
    }),
  }),
});

export const { useTestQuery } = apiSice;

Answer 1

我解决了这个问题，将后端URL更改为我当前的ipv4 (用于世博开发，否则只是您的后端URL )在我的.env文件中的地址，然后删除缓存并重新启动我的应用程序。在我的例子中，我使用的是世博，所以，expo r -c，它起作用了。