什么是 ref 引用

1. 什么是 ref 引用

ref 用来辅助开发者在 不依赖于 jQuery 的情况下 ，获取 DOM 元素或组件的引用。

每个 vue 的组件实例上，都包含一个 $refs 对象 ，里面存储着对应的 DOM 元素或组件的引用。默认情况下， 组件的 $refs 指向一个空对象 。

可以简单理解为：ref能获取元素或组件对象，然后就能够使用这个对象进行操作，比如修改样式等。

下面我来打印验证一下，可以看到下面的结果

 知道了ref的作用，关键是你得会怎么去使用，下面是方法：

2. 使用 ref 引用 DOM 元素

分两步

1.为DOM元素添加ref属性，后面写上名称，比如叫“hhh"

2.通过this就能够操作这个对象了

 

 

可以看到结果，点击按钮后，元素的样式被修改为了蓝色

3. 使用 ref 引用组件实例

上面是引用元素，下面咱们来引用组件

其实用法差不多

分两步

1.在要调用的组件上使用ref属性，后面加上名称，这次命名为counterRef

2.通过this来引用实例，这样就可以调用子组件上的 methods 方法

 

 

好了 学到了这里，我们就已经知道了ref的作用，以及它的使用方法了