jukenduit's questions

我开始使用Vite而不是CRA但我无法让代理工作。

我正在使用json server我的数据库，它位于http://localhost:3000/customers

使用 CRA，我会在 apiSlice 中"proxy": "http://localhost:3000",添加：package.json

const baseQuery = fetchBaseQuery({ baseUrl: "" });

然而这不适用于 Vite，所以我尝试将其添加到vite.config：

server: {
        proxy: {
            "/api": "http://localhost:3000",
        },
    },

并将我的更改baseQuery为：

const baseQuery = fetchBaseQuery({ baseUrl: "/api" });

但是我不断在控制台中收到此错误：

CustomerList.jsx:4 Uncaught TypeError: useGetCustomersQuery is not a function or its return value is not iterable

useGetCustomersQuery是我的 RTK 查询，我相信问题在于它没有与backend应有的方式进行通信。

我的useGetProductsQuery由于某种原因没有被认可。

产品ApiSlice.js

import { PRODUCTS_URL } from "../constants";
import { apiSlice } from "./apiSlice";

export const productsApiSlice = apiSlice.injectEndpoints({
    endpoints: (builder) => ({
        getProducts: builder.query({
            query: () => ({
                url: PRODUCTS_URL,
            }),
            keepUnusedDataFor: 5,
        }),
    }),
});

export const { useGetProductsQuery } = productsApiSlice;

成分：

import { useGetProductsQuery } from "../slices/productsApiSlice";

function HomeScreen() {
    const { data: products, isLoading, error } = useGetProductsQuery();

    return (
        <div className="row">
            {isLoading ? (
                <h2>Loading...</h2>
            ) : error ? (
                <div>{error?.data?.message || error.error}</div>
            ) : (
                <p>test</p>
            )}
        </div>
    );
}

我收到以下错误：

    (0 , _slices_productsApiSlice__WEBPACK_IMPORTED_MODULE_0__.useGetProductsQuery) is not a function
TypeError: (0 , _slices_productsApiSlice__WEBPACK_IMPORTED_MODULE_0__.useGetProductsQuery) is not a function