当前位置: 首页 > article >正文

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>


http://www.kler.cn/a/135420.html

相关文章:

  • 使用 start-local 脚本在本地运行 Elasticsearch
  • AI 写作(五)核心技术之文本摘要:分类与应用(5/10)
  • 《情商》提升:增强自我意识,学会与情绪共处
  • 【计算机网络】Socket编程接口
  • Nebula NGQL语言的使用 一
  • 【大数据学习 | kafka高级部分】kafka中的选举机制
  • WMS仓储管理系统的工作流程是什么
  • ElasticSearch 安装(单机版本)
  • 云原生微服务-理论篇
  • 【运维篇】5.6 Redis server 主从复制配置
  • C++中使用构造函数进行类型转换
  • C++——模板
  • Java中异常的捕获与处理
  • 你听说过“消费多少返利多少的”模式吗?
  • 基于Vue+SpringBoot的医院门诊预约挂号系统 开源项目
  • 【C/PTA】函数专项练习(二)
  • C语言幂级数求近似值
  • JC/T 2339-2015 地暖用相变储能材料及构件检测
  • 游戏报错d3dcompiler_47.dll缺失怎么修复,总结多种修复方法
  • Linux文件目录以及文件类型
  • Iceberg学习笔记(1)—— 基础知识
  • Linux:zip包的压缩与解压
  • C#开发的OpenRA游戏之属性QuantizeFacingsFromSequence(7)
  • 测试用例的设计方法(全):正交实验设计方法|功能图分析方法|场景设计方发
  • 代码随想录 11.16 || 动态规划 LeetCode 583.两个字符串的删除操作、72.编辑距离
  • 网工内推 | 国企、港企网工,年底双薪,NA以上认证即可