文档介绍：Vue第一天的组件有三个步骤:创建组件构造器(()方法),注册组件(())和实例化组件。<!DOCTYPEhtml><html><body><head><title>演示Vue</title></head><divid="container"><component1></component1></div></body><scriptsrc="./"></script><scripttype="text/javascript">//=({template:'<div>helloworld</div>'});//,ponent1>('component1',component1);//({el:'#container'});</script></html>浏览器编译后html结构会变为 <divid="container"><div>helloworld</div></div>页面运行显示为 helloworld。2-1()是Vue构造器的扩展,()创建的是一个组件构造器,该构造器有一个选项对象,选项对象的template属性用于定义组件要渲染的html。2-2()是注册组件,需要2个参数,第一个参数是自定义组件的标签,第二个参数是组件的构造器。2-3组件需要挂载到某个Vue的实例下,否则不生效。如下实例:<!DOCTYPEhtml><html><body><head><title>演示Vue</title></head><divid="container1"><component1></component1></div><divid="container2"><component1></component1></div><divid="container3"><component1></component1></div></body><scriptsrc="./"></script><scripttype="text/javascript">//=({template:'<div>helloworld</div>'});//,ponent1>('component1',component1);//({el:'#container1'});//({el:'#container2'});//不实例化container3因此第三个自定义标签是不会生效的</script></html>最终代码被渲染成为如下:<divid="container1"><div>helloworld</div></div><divid="container2"><div>helloworld</div></div>()注册组件时,组件的注册是全局的,如果想要使用组件的局部注册的话,ponents属性实现局部注册。如下代码:中间就把第二步注册组件哪项移到实例化组件里面来了;如下代码:<!DOCTYPEhtml><html><body><head><title>演示Vue</title></head><divid="container1"><component1></component1></div><divid="container2"><component1></component1></div></body><scriptsrc="./"></script><scripttype="text/javascript">//=({template:'<div>helloworld</div>'});//({el:'#container1',components:{'component1':component1}});//实例化container2是不生效的newVue({el:'#container2'})</script></html>实例化container2是不生效的,并且在浏览器控制台会报如下错误:。在一个组件中包含另一个组件,那么另一个组件就是该组件的子组件。如下代码:<!DOCTYPEhtml><html><body><head><title>演示Vue</title></head><divid="container1"><ponent></ponent></div></body><scriptsrc="./"></script><scripttype="text/javascript">//=({