javascript - 通过CDN加载Vuetify时获取“未知的自定义元素”

我尝试按照Vuetify website上的CDN使用示例进行操作，但是出现以下错误：


  [Vue警告]：未知的自定义元素：<v-list-tile>-您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。
  [Vue警告]：未知的自定义元素：<v-list-tile-action>-您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。
  [Vue警告]：未知的自定义元素：<v-list-tile-content>-您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。


请参见codepen上的示例。

JS：

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: {
    drawer: false,
    app_title: 'Custom Name...',
    elevations: [6, 12, 24],
    tiles: [4,5,6,7,8,9]
  },
})

HTML：

  <div id="app">
    <v-navigation-drawer
      v-model="drawer"
      temporary
      fixed
      app
    >
      <v-list dense>
        <v-list-tile @click="">
          <v-list-tile-action>
            <v-icon>home</v-icon>
          </v-list-tile-action>
          <v-list-tile-content>
            <v-list-tile-title>Home</v-list-tile-title>
          </v-list-tile-content>
        </v-list-tile>
        <v-list-tile @click="">
          <v-list-tile-action>
            <v-icon>contact_mail</v-icon>
          </v-list-tile-action>
          <v-list-tile-content>
            <v-list-tile-title>Report</v-list-tile-title>
          </v-list-tile-content>
        </v-list-tile>
      </v-list>
    </v-navigation-drawer>
    <v-toolbar color="#213f5e" dark fixed app>
      <v-toolbar-side-icon @click.stop="drawer = !drawer"></v-toolbar-side-icon>
      <v-toolbar-title>{{app_title}}</v-toolbar-title>
    </v-toolbar>
    <v-content>
      <v-item-group>
        <v-container fluid fill-height grid-list-md>
          <v-layout
            flex-child
            wrap
          >
            <v-flex
              v-for="tile in tiles"
              :key="tile"
              xs12
              md4
            >
              <v-sheet
                class="pa-5"
                color="grey lighten-3"
              >
                <v-card
                  :elevation="8"
                  class="mx-auto"
                  height="100"
                  width="100"
                >
                <div>bla bla bla</div>
                </v-card>
              </v-sheet>
            </v-flex>
          </v-layout>
        </v-container>
      </v-item-group>
    </v-content>
  </div>

最佳答案

我相信您使用的是当前版本2.0.3
只需将所有“ tile”替换为“ item”，例如将<v-list-tile>替换为<v-list-item>

关于javascript - 通过CDN加载Vuetify时获取“未知的自定义元素”，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/57261569/