关于Vue自定义组件的错误
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="vue.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="app">
            <fuqin></fuqin>
        </div>
        <template id="t1">
            <div>
                父组件, {{attr}}
                <erzi></erzi>
            </div>
        </template>
        <template id="t2">
            <div>
                子组件, {{attr1}}
            </div>
        </template>
        <script type="text/javascript">
        var vm=new Vue({
                el:'#app',
                components:{
                    "fuqin":{
                        template:"#t1",
                        data(){
                            return{
                                attr:"父组件的数据"
                            }
                        }
                    },
                    components:{
                        'erzi':{
                            template:"#t2",
                            data(){
                                return{
                                    attr1:"子组件的数据"
                                }
                            }
                        }
                    }
                }

            });


        </script>
    </body>
</html>

大佬帮我看看哪错了

这里是报错:

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

found in

--->

1个回答

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="//unpkg.com/vue/dist/vue.js"></script>
    </head>
    <body>
        <div id="app">
          <fuqin></fuqin>
          <template id="t1">
              <div>
                  上面是: {{attr}}
                  <erzi></erzi>
              </div>
          </template>
          <template id="t2">
              <div>
                  上面是: {{attr1}}
              </div>
          </template>
        </div>
    </body>
    <script type="text/javascript">
      var vm = new Vue ({
              el:'#app',
              data () {
                return {
                  attr: "Father data",
                  attr1: "Son data"
                }
              },
              components:{
                "fuqin": {template:"<h1 style='color:#F00'>父组件</h1>"},
                'erzi': {template:"<h3 style='color:#8aa'>子组件</h3>"}
              } 
        });
    </script>
</html>


看看这是否符合你的要求,没有很明白你的意思

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问