如何在全球范圍內加載類星體框架

Question

我是Quasar框架的新手。 有人可以解釋一下如何在全球范圍內使用類星體載荷。 （在我的應用程序中的所有位置）

我的main.js像這樣：

import Vue from 'vue'
import Quasar from 'quasar'
import router from './router'

require(`quasar/dist/quasar.${__THEME}.css`)

Vue.config.productionTip = false
Vue.use(Quasar) // Install Quasar Framework

if (__THEME === 'mat') {
  require('quasar-extras/roboto-font')
}
import 'quasar-extras/material-icons'
// import 'quasar-extras/ionicons'
// import 'quasar-extras/fontawesome'
// import 'quasar-extras/animate'

Quasar.start(() => {
/* eslint-disable no-new */
 new Vue({
  el: '#q-app',
  router,
  render: h => h(require('./App').default)
 })
})

Unknown custom element: <q-btn> - did you register the component correctly? 
For recursive components, make sure to provide the "name" option.

 found in

---> <App> at src\App.vue
   <Root>

Answer 1

每當使用任何Quasar元素（例如q-btn，q-select）時，都需要將其導入和導出到.vue文件中。

例如，要顯示<q-btn> ，您可以使用<q-btn > Confirm </q-btn>但是要顯示該內容，您需要在.vue文件中包括以下內容。 喜歡：

import {
     QSelect,
     QBtn
   } from 'quasar'
export {
     QSelect,
     QBtn
   } from 'quasar'

這樣，您將注冊所有組件。

Answer 2

在我的項目中，我導入並使用像這樣的組件

import Quasar, { QBtn, QSelect } from 'quasar-framewok';

Vue.use(Quasar, {
    components: { QBtn, QSelect }
});

僅用於測試用例全部導入

import Quasar, * as All from 'quasar';

Vue.use(Quasar, {
    components: All,
    directives: All
});

請參閱Quasar文檔