Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

dataTable中的defaultPageSize不生效 #5201

Closed
Colory opened this issue Sep 4, 2023 · 7 comments
Closed

dataTable中的defaultPageSize不生效 #5201

Colory opened this issue Sep 4, 2023 · 7 comments
Labels
untriaged need to sort

Comments

@Colory
Copy link

Colory commented Sep 4, 2023

TuSimple/naive-ui version (版本)

2.34.4

Vue version (Vue 版本)

3.3.4

Browser and its version (浏览器及其版本)

116

System and its version (系统及其版本)

win11

Node version (Node 版本)

18.15.0

Reappearance link (重现链接)

https://codesandbox.io/s/magical-architecture-p29q3j?file=/src/Demo.vue

Reappearance steps (重现步骤)

本地分页。非受控模式,设置了 defaultPageSize 不生效

Expected results (期望的结果)

应该是可以分页,默认分页大小符合设定

Actual results (实际的结果)

实际还是保持了 10 的分页设定。

Remarks (补充说明)

@github-actions github-actions bot added the untriaged need to sort label Sep 4, 2023
@jizai1125
Copy link
Contributor

jizai1125 commented Sep 5, 2023

DataTable 内部的分页是受控的

@Colory
Copy link
Author

Colory commented Sep 5, 2023

DataTable 内部的分页是受控的

意思是不支持非受控的设置分页大小吗,我记得之前的某个版本好像都还可以的。
如果需要通过table本地分页的话。就必须要设置受控分页才行了吗?可以简化为非受控模式的分页大小吗,后续版本有考虑支持非受控分页大小吗

@Colory
Copy link
Author

Colory commented Sep 5, 2023

DataTable 内部的分页是受控的

意思是不支持非受控的设置分页大小吗

支持啊,你可以通过 pageSize 设置

通过 pageSize 是受控的分页大小。那就无法和sizePicker联动了。需要手动去写联动代码。

{
      pageSize: 2,
      showSizePicker: true,
}

期望的是可以非受控下 与sizePicker 联动。 因为使用场景下是设置了分页 大小的可选项 默认从 30开始,页面较大

{
  defaultPageSize: 30,
  pageSizes: [30, 50, 100, 200],
  showSizePicker: true,
}

@Colory
Copy link
Author

Colory commented Sep 5, 2023

{
  pageSize: 30,
  pageSizes: [30, 50, 100, 200],
  showSizePicker: true,
}

https://codesandbox.io/s/magical-architecture-p29q3j?file=/src/Demo.vue
点击切换分页大小不生效。因为pageSize是受控的

@jizai1125
Copy link
Contributor

{
  pageSize: 30,
  pageSizes: [30, 50, 100, 200],
  showSizePicker: true,
}

https://codesandbox.io/s/magical-architecture-p29q3j?file=/src/Demo.vue 点击切换分页大小不生效。因为pageSize是受控的

需要监听下 updatePageSize 事件然后设置 pageSize,参考文档示例 受控的分页

@Colory
Copy link
Author

Colory commented Sep 5, 2023

{
  pageSize: 30,
  pageSizes: [30, 50, 100, 200],
  showSizePicker: true,
}

https://codesandbox.io/s/magical-architecture-p29q3j?file=/src/Demo.vue 点击切换分页大小不生效。因为pageSize是受控的

需要监听下 updatePageSize 事件然后设置 pageSize,参考文档示例 受控的分页

所以我就是想问下 会不会后期支持dataTable非受控的分页大小设置 这样的就不需要代码中手动去维护pageSize参数了

@jizai1125
Copy link
Contributor

{
  pageSize: 30,
  pageSizes: [30, 50, 100, 200],
  showSizePicker: true,
}

https://codesandbox.io/s/magical-architecture-p29q3j?file=/src/Demo.vue 点击切换分页大小不生效。因为pageSize是受控的

需要监听下 updatePageSize 事件然后设置 pageSize,参考文档示例 受控的分页

所以我就是想问下 会不会后期支持dataTable非受控的分页大小设置 这样的就不需要代码中手动去维护pageSize参数了

是有问题,我尝试修复下

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
untriaged need to sort
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants