如何解决“无法解析组件：v-treeview”

Question

如何最好地解决警告：

Failed to resolve component: v-treeview

，导致无法渲染所需的树视图组件？

我已经尝试了此处答案中的最佳建议，包括专门导入组件和指令并将它们传递给插件和主文件中的

createVuetify

（也在“入门”文档中建议。）我已经尝试过关闭缓存、降级 vuetify、删除

node_modules

并重新安装，以及其他一些不起作用或破坏一切的事情。

使用

• "vue": "^3.2.38"

• "vuetify": "^3.0.0-beta.10"

src/plugins/veutify.js （由 vite 或 vuecli 创建）

import '@mdi/font/css/materialdesignicons.css'
import 'vuetify/lib/styles/main.sass'
import { createVuetify } from 'vuetify'

export default createVuetify(

)

src/main.js （由 vite/vuecli 创建）

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import vuetify from './plugins/vuetify'
import { loadFonts } from './plugins/webfontloader'

loadFonts()

createApp(App)
  .use(router)
  .use(vuetify)
  .mount('#app')

Fields.vue （定制）

<template>
  <div>
    <v-treeview :items="structure" />
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';
...
// structure = [{name:'...',id:'...'},...]
const structure = ref([])
...
onMounted(async () => {
...
structure.value = await parseStructure(j)
}
...

Answer 1

在提出原始问题时，Vuetofy Treeview 在 vuetify v3 中不可用。

截至 2024 年 3 月 Treeview 可用，它确实需要 v3.5.9 或更高版本。

您还需要显式导入：

import { VTreeview } from 'vuetify/labs/VTreeview';