Question

我看到一些使用Vuetify的示例，其中仅显示模板，并且不导入Vue组件，例如VTool，更不用说VToolTitle，VToolItems等。但是，如果我不导入并声明它们，则会得到“未知的自定义元素：...”

我没有使用“ vue add vuetify”加载vuetify。那有必要吗？如果可以的话，我可以添加一些缺少的东西吗？

在我的main.js中，我有：

import Vue from 'vue'
import Vuetify from 'vuetify/lib'
import App from './App.vue'

Vue.config.productionTip = false
Vue.use(Vuetify)

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

此App.vue起作用：

<template>
  <v-app id="vuetify-app">
    <v-toolbar>
      <v-toolbar-title>
        Pro
      </v-toolbar-title>
      <v-spacer></v-spacer>
      <v-toolbar-items class="hidden-sm-and-down">
         <v-btn flat>List</v-btn>
         <v-btn flat>Profile</v-btn>
         <v-btn flat>Help</v-btn>
      </v-toolbar-items>
    </v-toolbar>
    <SignUp  msg="Welcome"/>
  </v-app>
</template>

<script>
import {VApp, VToolbar, VToolbarTitle, VToolbarItems, VSpacer, VBtn} from 'vuetify/lib'
import SignUp from './components/SignUp.vue'

export default {
  name: 'App',
  components: {
    VApp,
    VToolbar,
    VToolbarTitle,
    VToolbarItems,
    VSpacer,
    VBtn,
    SignUp
  }
}
</script>

但是，如果我注释掉：

import {VApp, VToolbar, VToolbarTitle, VToolbarItems, VSpacer, VBtn} from 'vuetify/lib'

和所有“ VApp，VToolbarTitle等”，我得到了未知的自定义元素消息。

Answer 1

此行：

import Vuetify from 'vuetify/lib'

是导入组件a la carte的方式。

如果您希望所有组件都在全球范围内注册，请像这样导入和安装Vuetify：

import Vue from 'vue'
import Vuetify from 'vuetify' // omit /lib

Vue.use(Vuetify)

为什么需要导入“ VToolbarItems”？

1 个答案: