♡ ‧₊˚动态组件 ₊˚ ♡
动态组件是指:在一个挂载点使用多个组件,并进行动态切换。
例如:在一个页面上有两个按钮,点击不同按钮会在页面的同一位置出现不同的内容。
在vue中可以用<component>的 is 特性来实现动态组件的效果。
示例:
<body>
<div id="app">
<button @click="current=One">一号</button>
<button @click="current=Two">二号</button>
<component :is="current"></component>
</div>
<script>
let One={
template:`
<div>一号组件的内容</div>
`,
}
let Two={
template:`
<div>二号组件的内容</div>
`,
}
new Vue({
components:{
'my-one':One,
'my-two&#