浅读vue组件（四）——$ref

一、将字组件的方法传递给父组件

ref 加在子组件上，用this.$refs.ref值获取到的是组件实例，可以使用组件的所有方法。在使用方法的时候直接this.$refs.ref值.方法（） 就可以使用了。

子组件：

父组件想使用子组件的方法：

先给子组件起个名字，利用ref给组件起名字

点击执行parent方法

parent方法：

this.$refs.layer

二、获取 dom元素

ref 加在普通的元素上，用this.$refs.ref值 获取到的是dom元素

可以获取到title的内容

打印出来的值是z-80购货测试表

小结：可以通过ref来获取id，value等属性的属性值，从而操作dom

$nextTick

vue给我们提供了$nextTick方法，如果我们想对未来更新后的视图进行操作，我们只需要把要执行的函数传递给this.$nextTick方法，vue就会给我们做这个工作。

比方说用v-for循环的列表，我们要对第一个li加个背景色，但是如果我们直接操作ul下边的li，li的视图并没有生成，所以我们可以选用$nextTick

三、利用 v-for 和 ref 获取一组数组或者dom 节点

可以通过给v-for循环加ref，然后通过this.$refs.ref值获取当前的数组节点