时间戳

首页 > 解决方案 > 在 Nuxt 中注册插件时出错，递归组件？

vue.js - 在 Nuxt 中注册插件时出错，递归组件？

问题描述

我正在努力将这个https://github.com/euvl/vue-js-grid添加到我的 nuxt 插件中！

在nuxt.config.js我有：

plugins: [
  { src: '~/plugins/vue-js-grid.js', ssr: false }
],

在vue-js-grid.js我有：

import Vue from 'vue'
import Grid from 'vue-js-grid'

Vue.use(Grid)

在mytemplate.vue我有：

<template>
  <div>
    <no-ssr>
      <Grid
        :draggable="true"
        :sortable="true"
        :items="items"
        :height="100"
        :width="150">
        <template slot="cell" slot-scope="props">
          <div>{{props.item}}</div>
        </template>
      </Grid>
    </no-ssr>
  </div>
</template>

（他们的示例代码）但我收到此错误：

commons.app.js:11507 [Vue warn]: Unknown custom element: <Grid> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <Pages/mytemplate.vue> at pages/mytemplate.vue
       <Nuxt>
         <Default> at layouts/default.vue
           <Root>

据我所知，我已经正确注册了所有内容？不是这样吗？

标签： vue.jsnuxt.js

解决方案

您是否尝试grid在模板中使用小写字母？

<template>
  <div>
    <no-ssr>
      <grid
        :draggable="true"
        :sortable="true"
        :items="items"
        :height="100"
        :width="150">
        <template slot="cell" slot-scope="props">
          <div>{{props.item}}</div>
        </template>
      </grid>
    </no-ssr>
  </div>
</template>

另外，注册插件后，您是否重新启动了开发服务器？

推荐阅读