1、安装

yarn add v-resize-wjs

2、使用

2.1、 全局注册自定义指令

import { createApp } from 'vue'
import useResize from 'v-resize-wjs'
const app = createApp(App)
app.use(useResize)

<template>
    <div class="box" v-resize="aaa"></div>
</template>

<script setup lang="ts">
    const aaa = (e) => {
        console.log('e', e)
    }
</script>

<style scoped>
    .box {
        border: 1px solid #ccc;
        resize: both;
        overflow: hidden;
    }
</style>

2.2、使用函数方法

<template>
    <div class="box"></div>
</template>

<script setup lang="ts">
    import { onMounted } from 'vue'
    import useResize from 'v-resize-wjs'
    onMounted(() => {
      useResize(document.querySelector('.box'), (e) => {
        console.log('e', e)
      })
    })
}
</script>

<style scoped>
    .box {
    border: 1px solid #ccc;
    resize: both;
    overflow: hidden;
}
</style>