vue3的自定义指令

<template>
    <div v-move:aaa.sbb="flag" v-show-model="'haveRole'">移动</div>
</template>
<script setup lang="ts">
import { Directive, ref } from 'vue';

const flag = ref<boolean>(false)
const VMove: Directive = {
    created() {
        
    },
    mounted(...args: Array<any>) {
        console.log(args);
        let el = args[0] as HTMLElement;
        const mousedown = (e: MouseEvent) => {
            console.log(e)
        }
        el.addEventListener('mousedown', mousedown);

        //IntersectionObserver 监听元素的可见部分比例 
        const obser = new IntersectionObserver((enr) => {
            console.log(enr);
            obser.unobserve(el);
        })
        obser.observe(el);
    },
    updated() {

    }
}

const VShowModel: Directive<HTMLElement, string> = (el, bind) => {
    console.log(el)
    console.log(bind.value)
}
</script>
<style></style>