vue-antd 分页pagination相关重置问题

本文主要是介绍vue-antd 分页pagination相关重置问题，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

1、在data中声明 pagination变量

      pagination: {         total: 0,         pageNum: 1,         pageSize: 10, //每页中显示10条数据         showSizeChanger: true,         pageSizeOptions: ['10', '20', '50'], //每页中显示的数据         showTotal: (total) => `共有 ${total} 条数据`, //分页中显示总的数据         showQuickJumper: true,         onShowSizeChange: (current, pageSize) => that.pageSize = pageSize, // 改变每页数量时更新显示  　　 注：在使用onShowSizeChange方法是需在return{}外声明个that , let that = this改变this指向问题否则无效       }, 2、在a-table中引入           <a-table              :columns="columns"              :data-source="data"             :pagination="pagination" // 分页             :rowKey="record=>record.id" // 唯一值辨认  提高diff算法同时防止不必要的报错提示             @change="handleTableChange"   //分页事件@change             /> 3、在handleTableChange事件中如果想重值页码需要添加字段current ，再要想让每页显示多少条动态生效需要添加pageSize 并重新赋值给data中声明的pagination 变量     //分页事件     handleTableChange(val, filters, sorter) {       console.log(val)       const pager = { ...this.pagination  };       pager.current = val.current;  // 查看文档可知current 是改变页码数必要字段       pager.pageSize = val.pageSize;  // 查看文档可知pageSize是改变动态条数必要字段       console.log(pager)       // console.log(filters)       this.pagination = pager;       this.refresh(val.current, val.pageSize)  //接口方法根据个人情况具体使用     }, 4、重置生效必须调用handleTableChange（）方法     //重置     reset() {       this.queryParam = {}       let val = {         current: 1,         pageSize: 10       }       this.handleTableChange(val)     }, 如有帮助请好评关注：谢谢您的支持

这篇关于vue-antd 分页pagination相关重置问题的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！