[英]Ant design Table table pagination with react query
我正在嘗試使用反應查詢在我的表(螞蟻設計表組件)上添加分頁以獲取數據,但有時它在從第 1 頁到第 2 頁時有效,但在到達最后一頁或更改頁面大小時無法正常工作我不知道為什么。 這是結果。 這是我的代碼。
const [pagination, setPagination] = useState({
current: 1,
pageSize: 10,
}); //pagination state
const fetchWaitlist = (page, pageSize) => {
return axios.get(API_URL + `tickets/waitlist?page=${page}&pageSize=${pageSize}&source=` + defaultAgency)
} //fetcher function
const {data: waitlist, refetch: refecthWaitList, isLoading} = useQuery(["waitlist", pagination.current, pagination.pageSize], () => fetchWaitlist(pagination.current, pagination.pageSize), {
onSuccess: (data) => {
setFilteredData(data?.data.content);
setPagination({
...pagination, total: data?.data.totalElements
}); // useQuery Hook
useEffect(() => {
setFilteredUserData(users?.data.content);
}, [users]); //state to perform search over the table
{!isLoading ? <Table
components={components}//Add new Custom Cell and Row
pagination={{
...pagination, showSizeChanger: true, onChange: (page, pageSize) => {
setPagination({current: page, pageSize: pageSize})
}
}}
columns={columns} rowClassName="waitlist-table_row--shadow" rowSelection={rowSelection} rowKey="id"
dataSource={filteredData} className="all-tickets_table" scroll={{x: "true"}}/> : <CustomLoader/>} //Table component
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.