Question

我正在用Nuxt建立一个网站。组件和页面内容是从CMS的asyncData中加载的。

我想在全球范围内声明可重复使用的组件，这样就不必导入10次，并且可以使用CMS修改网站。

所以我的页面看起来像这样：

<template>
  <div class="container">
    <component v-bind:is="blok.component" v-for="blok in page.body" :key="blok._uid" :content="blok" />
  </div>
</template>

<script>
export default {
    async asyncData (context) {
        const page = await context.app.$storyapi.get('cdn/stories/home/', {
            version: 'published'
        })
        return {
            page: page.data.story.content
        }
    }
}
</script>

我在/ plugins文件夹中有一个 components.js 文件

import Hero from '~/components/home/hero.vue'

Vue.component('hero', Hero.default)

和 nuxt.config.js

    plugins: [
        { src: '@/plugins/components', ssr: false }
    ],

我仍然收到此错误

<hero> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

有人知道如何全局声明它们吗？

全局定义组件NuxtJS / Vue

0 个答案: