未找到 v-data-table 组件

Question

我正在尝试使用 vuetify 创建 sudo 数据表。目的是使用 v-data-table 渲染动态计算的数据

但是，我在将 Vuetify 添加到我的应用程序时遇到问题。

我尝试添加

vue.use(Vuefity)

但它抛出一个错误 ->Property 'use' does not exist on type 'typeof

这就是我的代码的样子

vue.use(Vuefity)

computed: {
      headers(): string[] {
        return ["test1"]
      },
      items(): string[] {
        return ["test", "t2"];
      }
}

这就是我的 main.ts 的样子

<div>
    This is new data
    {{items[0]}}
    <v-data-table
       :items-per-page="5"
       :items="items"
       :headers="headers"
       class="elevation-1"> 
    </v-data-table>
</div>

当我尝试运行代码时，浏览器无法检测到 v-data-table。并抛出以下错误：

Failed to resolve component: v-data-table

Answer 1

目前，Vuetify 的某些组件尚未准备好在 Vue 3 中用于生产使用。但是有一种方法可以在项目中使用它。您可以在此处查看 Vuetify 官方文档的更多详细信息

import { createVuetify } from 'vuetify'
import { VDataTable } from 'vuetify/labs/VDataTable'

export default createVuetify({
 components: {
    VDataTable,
 },
})

Answer 2

Vuetify 目前支持 vue3使用 vue2。soVue.use在 vue3 中不可用，并且因为 vuetify disent 添加了该v-data-table组件不可用。