时间戳

首页 > 解决方案 > Vue 的 ref 每次使用时都会执行一次 DOM 查找吗？

javascript - Vue 的 ref 每次使用时都会执行一次 DOM 查找吗？

问题描述

我目前正在测试 Vue.js，并在我的项目中使用了一些参考。我不确定是否每次在我的方法中调用 ref 时都会执行 DOM Lookup，或者 vue 是否将所有 ref 存储一次然后访问该引用。

我无法通过文档或谷歌找到答案。

https://vuejs.org/v2/api/#ref

例子

myDiv = this.$refs.myDiv

我是否需要自己将 ref 存储在变量中，或者多次调用 ref 时不会影响性能？

标签： javascriptperformancevue.js

解决方案

浏览源代码，当启动一个 vue 实例时，它会将属性设置$ref = { }为一个空对象。查看initLifecycle功能

vm.$refs通过检查虚拟节点是否在函数中具有ref属性来填充该对象。vnode.data.refregisterRef

因此，您不必自己执行此操作。

并且引用$refs.myRef不执行 DOM 查找。它将由虚拟 dom 补丁进程管理。

推荐阅读