使用 ref 直接访问元素

https://book.51cto.com/art/201901/590004.htm

Vue.js进阶文章列表

有时你会发现需要直接访问一个 DOM 元素；也许你正在使用一个不支持 Vue 的第三方库，或者希望做一些 Vue 自身不能完全处理的事情。可以使用 ref 直接访问元素，而不需要使用 querySelector 或者其他选择 DOM 节点的原生方法。

使用 ref 访问一个元素，只需要将这个元素的 ref 属性设置为字符串，然后可以使用这个字符串访问元素：

1. <canvas ref="myCanvas"></canvas> 

这样，在 JavaScript 中，这个元素会被存储到 this.$ref 这个对象中，对应的键名就是为元素的 ref 属性设置的值。在这个例子中，可以使用 this.$ref.myCanvas 访问这个元素。