[Vue警告]:未知的自定义元素:<network>-您是否正确注册了组件?社交分享

时间:2019-05-26 15:47:59

标签: vuejs2

尝试使用vue-social-sharing(最新版本2.4.3)库,但不断获得以下内容:

[Vue警告]:未知的自定义元素:-您是否正确注册了组件?对于递归组件,请确保提供“名称”选项。

我已经按照指南查看了代码示例。但是,似乎无法弄清楚我的缺失或错误之处。

我创建了一个单独的组件,并紧随vue-social-share提供的示例。但是仍然继续得到错误。

这是我的main.js:

$('select').change(function () {
    var current = this.value;
    $.each($('#FilterContainer').find('div.all'), function () {
        $(this).removeClass('hidden');
    });

    $.each($('#FilterContainer').find('div.all').not('.' + current), function () {
        $(this).addClass('hidden');
    });
});

这是我的组件(SocialSharingTest.vue):

import Vue from 'vue'
import './plugins/vuetify'
import App from './App.vue'
import router from './router'
import store from './store'



Vue.config.productionTip = false;

let SocialSharing = require('vue-social-sharing');
Vue.use(SocialSharing);

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

组件无法正常运行,并且如上所述继续获得** [Vue警告]。我在这里看到了一个期望的工作示例:

https://codesandbox.io/s/3yv7q36lq?from-embed

3 个答案:

答案 0 :(得分:1)

import SocialSharing from 'vue-social-sharing';

import Vue from 'vue'
const VueSelect = {
  install(Vue, options) {
    Vue.component('SocialSharing', SocialSharing)
  }
};
Vue.use(VueSelect)

您可以尝试一下,看看是否有效吗?

答案 1 :(得分:0)

这是在全球范围内注册组件的方式:

const SocialSharing = require('vue-social-sharing');
Vue.component('social-sharing', SocialSharing)

vue docs

答案 2 :(得分:0)

我也开始在此组件上收到 [Vue警告]:未知的自定义元素:v-icon (在使用v-icon的其他组件中则没有)。为了解决这个问题,我添加了:

const Vuetify = require('vuetify');
Vue.use(Vuetify);

但是现在尝试将社交共享合并到我已经创建的组件中给了我 [Vue警告]:无法装入组件:模板或渲染功能未定义。

还没有研究那么多。可能与Vuetify有关(我试图将其包含在其中?我将继续挖掘那里发生的事情,但是如果有人知道它会发生什么,它将获得任何帮助。

谢谢。为了清楚起见,以上内容适用于原始问题。这一切似乎都在其自己的组件中起作用,只是没有按我期望的那样在尝试将其合并到要使用的组件中时起作用。

更新-适用于上述情况的所有工具,我只是没有在社交共享标签中添加 inline-template ,例如:

<social-sharing url="https://vuejs.org/" inline-template>