<template>
<div ref="element">
...
</div>
</template>
<script setup>
import {ref, onMounted, onBeforeUnmount} from "vue";
const isSmall = ref(false)
const element = ref(null);
const resizeObserver = new ResizeObserver(entries => {
// 处理大小变化的回调函数
if(element.value && element.value.offsetWidth < 1140) {
isSmall.value = true
} else {
isSmall.value = false
}
});
onMounted(() => {
getList()
resizeObserver.observe(element.value);
})
// 移除监听
onBeforeUnmount(() => {
resizeObserver.unobserve(element.value);
})
</script>