Vue学习笔记（六）

组件高级（下）

（一）ref引用

1.作用：不需要jQuery就可以获取dom元素和组件的引用。每个vue组件实例都包含一个$refs对象(默认指向空对象)，里面存储着对应dom元素或组件的引用。（this代表当前组件的实例对象）

2.ref引用dom实例

方法：为要使用的dom元素添加ref并起个名称

eg：<h3 ref="myh3">

通过this.去访问设置它的属性

eg：this.$refs.myh3.style.color="red"

3.ref引用组件实例

方法：为要引用的组件添加ref属性（跟DOM一样）

通过this.去调用它的方法

eg：this.$refs.xxxRefs.method1()

4.$nextTick(cb)把cb回调推迟到下一次重新渲染之后执行eg：$nextTick(his.$refs.xxxRefs.method1())

（二）动态组件

1.作用：动态切换组件的显示与隐藏

2.方法：在data定义第一个变量存储要渲染组件名称，然后使用内置组件<component>用is属性指定组件名称，用v-bind绑定

<component :is="针对的组件名称"></component>

3.使用keep-alive保持状态&