javascript - 在 VueJS 2.0 中迭代数据数组

Question

我有一个 vue 组件，我从 api 获取分页数据。

我想要做的是使用较小的分页总数更新迭代列表......因此在我的 vue 组件模板中

<td v-for="item in listItems">......
</td>

在脚本中

    {
  data (){ return { items:[]; pageSize:5, page:1 } // items is 20 in total; pageSize is 5 per page
  computed :{
    listItems: function(){ 
      var arr = [];
      while (i < this.pageSize) { 
        arr.push(this.items[i + (this.page * this.pageSize)]); 
       i++;
      } 
      return arr ;
      } 
    }, 
    methods:{ 
        getDATA: function(){ this.$http.get().then(response => {
                  this.items = response.data.data; // array of data objects
              }); 
          }
        }
  }

但是我得到一个空数组/我猜我不能像普通数组一样迭代

Answer 1

如果我理解正确的话，这可能就是您正在寻找的

export default {
  {
    data () { 
      return { 
        items: [],
        page: 1,
        pageSize: 1
      }
    },
    computed: {
      listItems() => { 
        while (i < this.pageSize) { 
          this.items[i + (this.page * this.pageSize)]; 
        }
      } 
    }
  }
}

但我不确定你想做什么，所以这是我能用有限的信息做的最好的事情，而且看起来你正在尝试在计算方法中设置数据，我不是 100%当然你可以...