首页 > 解决方案 > 无法在 vue js 中使用两个组件

问题描述

我是Vue的新手,我有一个问题:

这是我index.html使用 2 个自定义标签aas和任务:

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <div id="root"> 
        <aas></aas>
        <task></task>
    </div>
    <script src="../index/vue.js"></script>
    <script src="main.js"></script>
</body>
</html>

我的main.js

Vue.component('aas', {
        template:'<a><slot></slot></a>'
    });
    Vue.component('task', {
        template:'<li><slot></slot></li>'
    });
    new Vue({
        el:'#root'
    });

但我有一个错误:

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

(found in <Root>)

有办法解决吗?!

标签: javascriptvue.jsvuejs2vue-component

解决方案


尝试在您的组件中设置名称:

Vue.component('aas', {
  name: 'aas',
  template:'<a><slot></slot></a>'
});

根据这个问题,它应该解决该警告。


推荐阅读