今天用Vue写页面的分页时发现了一个问题,在这里记录下,也希望可以帮助其他人.

问题如下,我在一个页面比如点击第三页(数字3)时,显示第三页绑定的数据正常,但是当我点击一个其他的页面,这个新的页面绑定的数据在分页后也会直接显示第三页的数据,不是从第一页开始的.

解决方法:

1.使用:current-page.sync

<el-pagination
   class="tc mg"
   :current-page.sync="pageNum"
   :page-size="pageNum"
   layout="total, sizes, prev, pager, next, jumper"
   :total="total_rows"
   @size-change="pageSizeChange"
   @current-change="pageCurrentChange"
 ></el-pagination>

2. 给current-page.sync的值赋值为1,则分页页面按钮总会显示1开始,接下来需要按照你的逻辑判断什么时候需要让它显示1,什么时候显示2,3...等,  :current-page.sync="pageNum"

queryData(){
	this.pageNum = 1;
	...
}

如果不懂得可以去看下下面这位博主的文章:

https://blog.csdn.net/qiuqiu1894/article/details/105139028?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-4&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-4