首先抱歉,前段时间整理的东西没有写数字和索引,导致自己都看了烦,so,下面的日子我会写索引。
1. 先写个template (你组件所需要的)
<template id="aaa">
<h1>xxxx</h1>
<slot>这是默认的情况</slot>
<p>welcome vue</p>
</template>
2.给个div
<div id="box">
<ccc>
<ul>
<li>1111</li>
<li>2222</li>
<li>{{a}}</li>//这里我是测试组件 里面能不用我的vue数据
</ul>
</ccc>
<hr>
<ccc>
</ccc>
</div>
3.这里是js
var vm=new Vue({
el:'#box',
data:{
a:'aaa'//vue数据
},
components:{
'ccc':{
template:'#aaa'
}
}
});
结果:
总结一下,组件其实是代码的复用,(可能有些我不知道的功能)