vue 获取元素高度

Posted 2022-06-04 lymconch

1、html
<div ref="getheight"></div> 


2、javascript
// 获取高度值 （内容高+padding+边框）
let height= this.$refs.getheight.offsetHeight;  

// 获取元素样式值 （存在单位）
let height = window.getComputedStyle(this.$refs.getheight).height; 

//获取元素内联样式值（非内联样式无法获取）
let height = this.$refs.getheight.style.height; 


// 注意：要在元素渲染出来才能获取元素的高度
实例：
 mounted()
	this.$nextTick(()=> // 页面渲染完成后的回调
		console.log(this.$refs.getheight.offsetHeight)
	)