时间戳

首页 > 解决方案 > 错误“未知的自定义元素...”仅适用于某些 Vuetify 组件，如 v-expansion-panels

vue.js - 错误“未知的自定义元素...”仅适用于某些 Vuetify 组件，如 v-expansion-panels

问题描述

我使用了 Vuetify 的一些组件（v-card、v-toolbar、...），总体来说它可以工作。但是对于像 v-expansion-panels 这样的某些组件，我有这个错误：“未知的自定义元素：< v-expansion-panels > - 你是否正确注册了组件？对于递归组件，请确保提供“名称”选项。 "

我测试了几种解决方案，但没有任何效果

main.js

import Vue from 'vue'
import './plugins/vuetify.js'
import App from './App.vue'

new Vue({
   router,
  store,
  render: h => h(App)
}).$mount('#app')

Vuetify.js

import Vue from 'vue'
import 'vuetify/src/stylus/app.styl'

Vue.use(Vuetify, {
  iconfont: ' md || fa', 

  theme: {
    primary: '#F5A623',
    secondary: '#a9a9a9',
    accent: '#82B1FF',
    error: '#FF5252',
    info: '#2196F3',
    success: '#4CAF50',
    warning: '#FFC107',
  }
})

和我的组件：

<template>
    <div>
        <v-expansion-panels>
            <v-expansion-panel v-for="(item,i) in 5" :key="i">
                <v-expansion-panel-header>Item</v-expansion-panel-header>
                <v-expansion-panel-content>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-expansion-panel-content>
            </v-expansion-panel>
        </v-expansion-panels>
    </div>
</template>

<script>
export default {};

我尝试在 Vuetify.js 中添加不同方式的组件，例如：

import Vuetify, { VExpansionPanel } from 'vuetify/lib'
Vue.use(Vuetify, {
  components: {
    VExpansionPanel
  },

但任何作品

否则我的应用程序工作正常。控制台中没有错误。

谢谢你的帮助

马可

标签： vue.jsvuetify.js

解决方案

好像您正在使用 Vuetify 1.5.x，并且没有<v-expansion-panels>组件。升级到 Vuetify2.x或参考有关扩展面板的旧文档。

推荐阅读