vue中 ref 和 $refs的使用

1. 作用

利用 ref 和 $refs 可以用于 获取 dom 元素, 或 组件实例

2. 获取 dom

使用步骤：

2.1 目标标签添加属性 :ref

<div ref="chartRef">我是渲染图表的容器</div>

2.2 通过$ref：获取标签

mounted() {
  console.log(this.$refs.chartRef) // 打印查看标签
},

3. 获取组件

3.1 目标组件 – 添加属性 :ref

<BaseForm ref="baseForm"></BaseForm>

3.2 通过$ref：获取目标组件

• 可以使用目标组件调用组件对象里面的方法

this.$refs.baseForm.组件方法()