Vue项目中如何准确获取动态变化DOM元素的宽高？

本文共计720个文字，预计阅读时间需要3分钟。

DOM元素内容是动态的，数据重置后直接获取宽高总是不准确的：`this.$refs.editor[0].offsetHeight;`原因：重置数据后获取DOM宽高时，元素可能还未完成渲染；解决方法：使用`Vue.nextTick`。

dom元素内部内容是动态的，重置数据后直接获取宽高总是不准确：

this.$refs.editor[0].offsetHeight;

原因：重置数据后获取dom元素宽高时，dom元素还未渲染完毕；

解决方法：利用Vue.nectTick(callback)

this.$nextTick(() => { this.$refs.editor[0].offsetHeight; })

Vue.nectTick() 是在下次DOM更新循环结束之后执行延迟回调

补充知识：vue 获取 指定元素的高度宽度等（使用vue中的 ref 获取到的是 dom 元素高度或者宽度）

使用 vue 的时候，想要获得一个指定的元素的高度时，可以使用 vue 中的 ref 。