vue ref 的理解和使用

我们经常使用到ref，但是当别人问你 ref 是什么的时候，是否发现自己竟然说不出来，接下来一起来了解了解下吧~

用意：可以通过 ref 为所有的子组件赋予一个 ID 引用。这句话何解呢？看以下两个例子你就明白了：

1. 标注单个标签上

<div>
 <p ref="test">你好呀</p>
 <span>哎呀，你好坏呀</span>
</div>
<el-button @click="testBtn">点击</el-button>

console.log(this.$refs.test)

打印结果：

2. 标注在父组件上

<div ref="test">
 <p >你好呀</p>
 <span>哎呀，你好坏呀</span>
</div>
<el-button @click="testBtn">点击</el-button>

console.log(this.$refs.test)

打印结果：

好了，日常中我们经常用到的地方有哪些呢，其中我记忆中的是表单验证那一块，这里我也写了下，可以去看看加深理解，see you~