vue 组件中分页显示问题

mysql模拟了两页数据,点击下一页后页面有第二页内容,闪了一下又变回上一页的数据。求解答谢谢。

img

img

问题可能出现在下一页方法上面,闪一下代表整个页面刷新了,所以又显示初始界面了,仔细再检查一下你的方法有没有触发整个页面刷新的,当然还有一个方法就算整个页面刷新了也不会改变当前状态,就是使用监听器watch,可以去官网了解一下,常见用于网页导航栏选中特效,刷新整个页面不会失去当前状态,当然也可以用于分页

这种逻辑错误,最好设置断点调试,看看后台逻辑有没有问题。

前端自己实现分页的话,应该就是分割数组时出问题了 你仔细打印一下分割的数据是否正常。 按照你的说法,已经显示了第二页数据,闪一下的话又到了第一页的数据。
说明 dataShow 有问题。因为只有改变数据,页面才会变化。你查一下 给this.dataShow赋值的地方。

我看很别扭, 看下来像前端分页, 我给你改造下

第一个 data 中的dataShow 变量去掉
第二个

img

第三个 计算属性里的方法去掉 新增一个dataShow 方法


dataShow () {
  return this.saleList.slice(this.pageSize * this.currentPage, this.pageSize * (this.currentPage+1))
}

第四 上页和下页 分别把值赋给当前页就行