6 vue动态组件

1.html代码

<div id="box">
		<input type="button" @click="a='aaa'" value="aaa组件">
		<input type="button" @click="a='bbb'" value="bbb组件">
		<component :is="a"></component>//选择哪个组件
	</div>

2.js代码

<script>
		var vm=new Vue({
			el:'#box',
			data:{
				a:'aaa'//默认组件
			},
			components:{//组件
				'aaa':{
					template:'<h2>我是aaa组件</h2>'
				},
				'bbb':{
					template:'<h2>我是bbb组件</h2>'
				}
			}
		});

	</script>

3.结果