vue.js分页错误计算

时间:2019-07-05 16:10:57

标签: javascript vue.js vuejs2

在我的应用程序中,我有一些分页代码,这些代码根据REST API中的数据计算分页。当我添加页面页面时,它是从页面0开始而不是从1开始计算的,因此它表示9的0,到最后它表示9的8,何时应该说9的1和9的9。结束。到目前为止,我的代码是:

HTML

<p>Page {{page}} of {{pageCount}}</p>

JS

data: function() {
    return {
      page: 0
    };
  },

computed: {
    pageCount() {
      let l = this.result.length,
        s = this.size;
      return Math.floor(l / s);
    },
    paginated() {
      const start = this.page * this.size,
        end = start + this.size;
      return this.result.slice(start, end);
    }
  },

有什么想法吗?也许我计算的math.floor方法不正确?

2 个答案:

答案 0 :(得分:2)

您的页面变量的索引为0而不是1。您可以保持这种方式,以便您的分页能够继​​续按预期工作,但是在将其输出给用户的地方,您只需添加1就可以使它对用户有意义。

<p>Page {{page + 1}} of {{pageCount}}</p>

答案 1 :(得分:1)

据我了解,您的pageCount()方法是正确的,因为您确实有9个页面,所以math.floor并不是问题,您的页面变量是不正确的页面,但我看不到您从哪里获取该变量但是一个简单而粗略的解决方案是将变量加1。