vue.js - 如何将 'import'一个Vue组件变成一个Vue组件

标签 vue.js vue-component

这可能是一个非常愚蠢的问题,但尽管如此,我还是找不到答案。

因此,我正在构建一个 Vue 组件并想访问 vue-spinner我的组件内的组件。我该怎么做?

以下是相关代码片段:

app.js:

Vue.component('players', require('./components/TeamPlayersComponent.vue'));

import GridLoader from 'vue-spinner/src/GridLoader.vue';

const app = new Vue({
    el: '#app',
    components: {
        GridLoader
    }
});

TeamPlayersComponent.vue:

<grid-loader></grid-loader>

假设已安装 vue-spinner (NPM) 并且 TeamPlayersComponent.vue除了在控制台中给出此错误之外有效且有效:

vue.js?3de6:525 [Vue warn]: Unknown custom element: <grid-loader> - did you register the component correctly? For recursive components, make sure to provide the "name" option. (found in component <players> at /home/vagrant/code/rounds-smaa/resources/assets/js/components/TeamPlayersComponent.vue)

我将 Vue 与 Laravel Elixir 和 Gulp 结合使用。

最佳答案

您可以通过以下方式获取:

var PulseLoader = require('vue-spinner/src/PulseLoader.vue');

并将其添加到组件中:

new Vue({
  components: {
    'PulseLoader': PulseLoader
  }
})

关于vue.js - 如何将 'import'一个Vue组件变成一个Vue组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41460433/

相关文章:

vue.js - Vuex-module-decorator,修改 Action 内的状态

vue.js - Vue CLI 从项目模块动态导入

vue.js - Vue-Loader——导入一个导入组件的文件

vue.js - 将 quill 模块与 vue2-editor 和 webpack 混合使用

javascript - 获取json数据时如何去掉promise

javascript - 如何使用 Vue JS 从下拉列表中删除数组中的项目

javascript - Vue 组件 - 如何避免改变 prop(Laravel 组件)

javascript - Vuetify 文本区域为空或少于 200 个字符的规则

javascript - post请求返回的数据未传递到vue模板

vue.js - VueJS - Vue 未定义