19.vue中监听dom元素尺寸变化
leezozz 3/8/2023 笔记
# 使用useElementSize方法
<template>
<div ref="el">
Height: {{ height }}
Width: {{ width }}
</div>
</template>
<script>
import { ref } from 'vue'
import { useElementSize } from '@vueuse/core'
export default {
setup() {
const el = ref(null)
const { width, height } = useElementSize(el)
return {
el,
width,
height,
}
}
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24