A
Anonymous

Product Store - Copy this React, Tailwind Component to your project

import { useState } from "react"; import { dataProvider } from "../base/api"; import { useQuery } from '@tanstack/react-query'; export const useList = ({ resource, options }) => { const [page, setPage] = useState(0); const [pageSize, setPageSize] = useState(10); const { getList } = dataProvider(resource); const { data = [], refetch, ...query } = useQuery({ queryKey: ['products', page, pageSize], // Sử dụng mảng để queryKey queryFn: () => getList(pageSize, page), ...options, // Thêm options nếu có }); const onPagination = (page, pageSize) => { setPageSize(pageSize * page); setPage((page > 0 ? page - 1 : page) * pageSize); }; return { data, onPagination, query }; // Trả về query để lấy các giá trị như isLoading, error, v.v. } dùng hook này

Prompt

About

ProductStore - A dynamic product listing component with pagination, filters, and search functionality, professionally built with React and Tailwind. Get component free!

Share

Last updated 1 month ago