我正在使用Primereact,我想提高表的性能,所以我想让它成为服务器端分页,但我有一些问题服务器端分页工作与此代码,但过滤器也停止了下载CSV我想让它下载所有的数据,过滤,而不仅仅是在屏幕上呈现的25,我如何实现这一点?

useEffect(() => {
  setFiltered(filteredData)
},[filteredData])
    <DataTable
      scrollable
      size="small"
      scrollHeight="auto"
      className="datatable"
      dataKey="id"
      sortIcon={<PiSortDescendingBold />}
      exportFilename={`${new Date().toLocaleDateString()}`}
      value={filteredData}
      ref={ref as any}
      sortMode="single"
      paginator
      lazy
      loading={loading}
      first={first}
      rows={rows}
      onPage={e => {
        setFirst(e.first)
        setRows(e.rows)
      }}
      totalRecords={count}
      rowsPerPageOptions={[10, 25, 50, 100]}
      paginatorTemplate="RowsPerPageDropdown FirstPageLink PrevPageLink CurrentPageReport NextPageLink LastPageLink"
      paginatorLeft
      currentPageReportTemplate="{first} to {last} of {totalRecords}"
      emptyMessage="No Data !"
      onValueChange={e => setFiltered(e)}
   // columns
    </DataTable>

首先,rows是一个useState,里面有一个数字,setFiltered是一个空数组useState计数来自数据库的总计数

推荐答案

完整的工作示例使用服务器端REST API for PrimeReact DataTable排序、筛选、分页等.

包括REST服务器并在一个示例中提供用户界面代码.

请参阅:https://github.com/melloware/quarkus-primereact

Reactjs相关问答推荐

导致类型错误的调度不是函数";

客户端组件中服务器组件的两难境地

包装组件可以避免子组件重新渲染.?

react 路由GUGUD Use Effect无法通过useNavigate正常工作

无法使用Reaction日期选取器和Next.js设置初始日期

折叠并重新打开react 手风琴将重置内部状态

React,当我调用handleSubmit()函数时,我正在将application/json和multiform/data中的数据发送到后端,但student_image中没有数据:null

如何在React组件中自动更新图表数据?

PWA:注册事件侦听器不会被触发

通过createRoot创建的React元素无法调用Provider值

如何修改 react/jsx-no-useless-fragment 规则以允许 <>{children}

单击按钮时如何添加或删除 3d 对象

onChange in useEffect 的最佳实践

虽然通过了身份认证,但并没有导航到请求的页面

我可以更改 styled() 中的响应吗? (MUI v5)

如何在 React map 函数循环中使用
标签

如何使用 React Hook Form 将寄存器作为 props 发送到子组件来收集数据?

react 测试显示错误的结果

React Router 6.4CreateBrowserRouter子元素不显示

a.active 类在导入 x.scss 文件时有效,但在使用 x.module.scss 时无效