vue中ref和$refs

1.作用

利用ref 和 $refs 可以用于 获取 dom 元素 或 组件实例,也可以在父组件获取子组件,从而调用子组件的方法。

2.特点:

查找范围 → 当前组件内(更精确稳定)

3.语法

1.给要获取的盒子添加ref属性

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

2.获取时通过 $refs获取 this.$refs.chartRef 获取

mounted () {
  console.log(this.$refs.chartRef)
}

4.注意

之前只用document.querySelect(‘.box’) 获取的是整个页面中的盒子,
App.vue