vue教程3-03 vue组件，定义全局、局部组件，配合模板，动态组件
一、定义一个组件
1 Aaa='
放到某个组件内部
<span style="color: #0000ff;">var vm=<span style="color: #0000ff;">new<span style="color: #000000;"> Vue({
el:'#Box'<span style="color: #000000;">,data:{
bSign:<span style="color: #0000ff;">true<span style="color: #000000;">
},components:{ <span style="color: #008000;">//<span style="color: #008000;">局部组件
<span style="color: #000000;"> aaa:Aaa
}
});
我是标题3
'Vue.component('aaa'<span style="color: #000000;">,Aaa);</span>*<span style="color: #000000;">组件里面放数据:
data必须是<a href="/tag/hanshu/" target="_blank" class="keywords">函数</a>的形式，<a href="/tag/hanshu/" target="_blank" class="keywords">函数</a>必须返回一个对象(json)放到某个组件内部
<span style="color: #0000ff;">var vm=<span style="color: #0000ff;">new<span style="color: #000000;"> Vue({
el:'#Box'<span style="color: #000000;">,data:{
bSign:<span style="color: #0000ff;">true<span style="color: #000000;">
},components:{ <span style="color: #008000;">//<span style="color: #008000;">局部组件
<span style="color: #000000;"> aaa:Aaa
}
});
1. 全局组件
<Meta charset="UTF-8">
Document
Box">
<script><br><span style="color: #000000;"> //另外一种写法，全局
Vue.component(</span>'my-aaa'<span style="color: #000000;">,{
template:</span>'<strong>好</strong>'<span style="color: #000000;">
});
</span><span style="color: #0000ff;">var</span> vm=<span style="color: #0000ff;">new</span><span style="color: #000000;"> Vue({
el:</span>'#<a href="/tag/Box/" target="_blank" class="keywords">Box</a>'<span style="color: #000000;">
});
</span></script>