vue 获取ref高度

在Vue中，可以使用`this.$refs`来获取组件的引用(ref)。要获取引用的高度，可以通过`$el.offsetHeight`属性来获取。例如，如果你有一个组件引用名为"searchBar"，你可以使用以下代码获取它的高度：

const searchBarHeight = this.$refs.searchBar.$el.offsetHeight;

同样地，如果你有一个组件引用名为"bottomOperateBtn"，你可以使用以下代码获取它的高度：

const bottomBtnHeight = this.$refs.bottomOperateBtn.$el.offsetHeight;

你还可以使用`window.innerHeight`来获取浏览器的可视区域高度：

const height = window.innerHeight;

最后，你可以使用`calc()`函数来计算并设置元素的高度，例如：

this.$refs.classifyContent.style.height = `calc(${height}px - ${searchBarHeight}px - ${bottomBtnHeight}px)`;

这样就可以根据浏览器窗口的高度动态设置元素的高度了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [vue动态获取高度(移动端)](https://blog.csdn.net/JunVei/article/details/126273230)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]