在构建 Vue 应用程序时,我们在每个模板中重复使用某些 Vue 组件。我们的网格系统存在于 .region、.layout、.grid、.column 元素之外。它们都是独立的 Vue 组件 (, ...)。
我们现在在每个模板中都这样做:
import BlMain from '~components/frame/main/Main.vue'
import BlRegion from '~components/frame/region/Region.vue'
import BlLayout from '~components/frame/layout/Layout.vue'
import BlGrid from '~components/frame/grid/Grid.vue'
import BlColumn from '~components/frame/column/Column.vue'
有没有办法在你的项目中全局导入 Vue 组件? 是否可以选择创建一个包含上述导入的组件 Frame.vue 并在每个模板中添加 Frame 组件? 其他 FE 框架如何解决这个问题?
我们正在使用 Nuxt JS在 Vue 上。
最佳答案
您应该使用注册该帐户的插件。
// plugins/bl-components.js
import Vue from 'vue'
import BlMain from '~components/frame/main/Main.vue'
import BlRegion from '~components/frame/region/Region.vue'
import BlLayout from '~components/frame/layout/Layout.vue'
import BlGrid from '~components/frame/grid/Grid.vue'
import BlColumn from '~components/frame/column/Column.vue'
const components = { BlMain, BlRegion, ... }
Object.entries(components).forEach(([name, component]) => {
Vue.component(name, component)
})
// nuxt.config.js
export default {
plugins: ['~plugins/bl-components']
}
关于javascript - Vue (nuxt) 中的全局组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43040692/