ref被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素;如果用在子组件上,引用就指向组件实例
# 普通dom元素上
<p ref="p">hello</p>
# 子组件上
<child-comp ref="child"></child-comp>
# 调用
this.$refs.引用名
通过使用保留的 <component> 元素,动态地绑定到它的 is 特性,我们让多个组件可以使用同一个挂载点,并动态切换
<component v-bind:is="currentView"></component>
<script>
var vm = new Vue({
el: '#root',
data: {
currentView: 'home'
},
components: {
home,
posts
}
})
</script>
² keep-alive
如果把切换出去的组件保留在内存中,可以保留它的状态或避免重新渲染。
<keep-alive>
<component :is="currentView"></component>
</keep-alive>
<script>
var vm = new Vue({
el: '#root',
data: {
currentView: 'posts'
},
components: {
home,
posts
}
})
</script>