Meu useGetProductsQuery
não está sendo reconhecido por algum motivo.
produtosApiSlice.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;
componente:
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>
);
}
Estou tendo o erro a seguir:
(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
Isso geralmente acontece se
createApi
não for importado do ponto de entrada específico do React@reduxjs/toolkit/query/react
, mas do framework-agnostic@reduxjs/toolkit/query
.Você pode verificar suas importações?