Vue.js 在vuetify数据表中搜索(服务器端)

Vue.js 在vuetify数据表中搜索(服务器端),vue.js,datatables,vuetify.js,Vue.js,Datatables,Vuetify.js,我在应用程序中使用vuetify datatables和服务器端。 分页和排序工作正常,但我对搜索输入有问题——当我在输入中写入内容时,新请求不会发送到api 我用找到了解决方案,但当我尝试时,控制台中出现错误: [中断]“分页”已被删除,请改用“选项”。对于 有关详细信息,请参阅《升级指南》 我的代码在这里: <template> <v-container fluid> <v-text-field v-model=&q

我在应用程序中使用vuetify datatables和服务器端。 分页和排序工作正常,但我对搜索输入有问题——当我在输入中写入内容时,新请求不会发送到api

我用找到了解决方案,但当我尝试时,控制台中出现错误:

[中断]“分页”已被删除,请改用“选项”。对于 有关详细信息,请参阅《升级指南》

我的代码在这里:

<template>
  <v-container fluid>
        <v-text-field
            v-model="search"
            append-icon="mdi-magnify"
        ></v-text-field>
        <v-data-table
            :items="usersList"
            :headers="headers"
            sort-by="name"
            :sort-desc="false"
            :options.sync="options"
            :server-items-length="totalUsers"
            :search="search"
            :loading="loading"
            loading-text="Ładowanie..."
            class="elevation-0"
        ></v-data-table>
  </v-container>
</template>

<script>
  export default {
    data: () => ({
      totalUsers: 0,
      usersList: [],
      search: "",
      loading: true,
      options: {},
      headers: [
        { text: 'Nazwa użytkownika', value: 'name' },
        { text: 'Adres e-mail', value: 'email' },
        { text: 'Opcje', value: 'actions', sortable: false },
      ]
    }),

    watch: {
      options: {
        handler () {
          this.getUsers();
        },
        deep: true
      },
    },

    mounted () {
      this.getUsers();
    },

    methods: {
      getUsers() {
        this.loading = true;

        userService.getAll(this.options).then(data => {
            if (data.status == "success") {
                this.usersList = data.items;
                this.totalUsers = data.total;
            } else {
                console.log("Nie udało się pobrać użytkowników.");
            }

            this.loading = false;
        });
      },
    }
  };
</script>

导出默认值{
数据:()=>({
用户总数:0,
用户列表:[],
搜索:“,
加载:对,
选项:{},
标题:[
{文本:'Nazwa użytkownika',值:'name'},
{text:'Adres e-mail',value:'email'},
{text:'Opcje',value:'actions',sortable:false},
]
}),
观察:{
选项:{
处理程序(){
这是getUsers();
},
深:是的
},
},
挂载(){
这是getUsers();
},
方法:{
getUsers(){
这是。加载=真;
getAll(this.options)。然后(data=>{
如果(data.status==“成功”){
this.usersList=data.items;
this.totalUsers=data.total;
}否则{
console.log(“Nie udało siępobraćużytkowników.”);
}
这一点:加载=错误;
});
},
}
};