vue 获取table行高度
时间: 2023-10-02 17:07:38 浏览: 73
你可以使用以下代码来获得表格中行的高度:
```javascript
const table = document.getElementById('my-table');
const rowHeight = table.rows[0].clientHeight;
```
其中,`my-table` 是你的表格的 ID,`rows[0]` 是你想要获取高度的行的索引。你可以将这段代码放入 `mounted()` 或 `created()` 生命周期钩子函数中,以确保在表格渲染完毕后获取行高。
相关问题
vue 获取el-table的高度
可以通过 $refs 获取 el-table 的 DOM 元素,然后使用 offsetHeight 属性获取高度。示例代码如下:
```
<template>
<el-table ref="table"></el-table>
</template>
<script>
export default {
mounted() {
const tableHeight = this.$refs.table.$el.offsetHeight;
console.log(tableHeight);
}
}
</script>
```
vue3 获取table 距离顶部距离
```javascript
<template>
<div ref="tableRef"></div>
</template>
<script>
export default {
mounted() {
window.addEventListener('scroll', this.handleScroll, true)
},
methods: {
handleScroll() {
console.log('滚动高度', window.pageYOffset)
console.log('距离顶部高度', this.$refs.tableRef.getBoundingClientRect().top)
}
}
}
</script>
```