Question

我有以下格式的API返回的对象：

{
 "count": 0,
 "result": [
    {
     "id": "5dfbb8d5b2f68faf05688997",
     "createdOn": "1577121878136",
     "hash": "d7a3a552a2c1a765b3bcd935980a1982",
     "modifiedOn": "1577121878136",
     "company": {},
     "home": {},
     "first_name": "string",
     "last_name": "string",
     "isActive": true,
     "funding": "string",
     "medication": "string",
     "startDate": "string"
    }
  ]
}

我正在使用vuex存储数据。如何使用vuetify's v-data-table进行分页。后端是分页的。我的api是axios.get(..../?page='+page + '&count='+count)'，我需要传递page和count作为参数来获取分页数据。

如果您能为我提供一些资源，我将不胜感激。我尝试过，但无法实现，也没有找到任何材料。我在vuetify's docs后面跟随external pagination，但是这里假定数据只是在外部进行分页，它们不链接到veux store。

Answer 1

使用这些参数调用v-data-table。

<v-data-table
        :headers="yourHeadersArrayOfObject"
        :items="yourItemsArrayOfObject"    
        :page="yourCurrentPageNumber"
        :items-per-page="yourItemsPerPage"
        @update:page="pageUpdateFunction"
      ></v-data-table>

on方法处理页面更新=>

pageUpdateFunction(newPageNumber) {
  console.log(newPageNumber);
  // handle other axios request here and update varibles
},

外部分页验证数据表

1 个答案: