首页 > 其他分享 >自定义指令

自定义指令

时间:2022-11-08 17:00:09浏览次数:38  
标签:el 自定义 Directive vnode 指令 dir

vue3自定义指令

type Dir = {
  background: string
}
const vMove: Directive = {
  created() {},
  beforeMount() {},
  mounted(el: HTMLElement, dir: DirectiveBinding<Dir>, vnode) {
    // el 绑定elment元素
    // dir 实例上下文 v-model:name.custom='test'
    // 1. arg 参数名(name)
    // 2. value 传递的值(test)
    // 3. oldValue 上一次的值
    // 4. modifiers 自定义修饰符(custom)
    // 5. instance 组件实例
    // 6. dir 生命周期
    // vnode 虚拟dom
    console.log(el, dir, vnode)
  },
  beforeUpdate() {},
  updated() {},
  beforeUnmount() {},
  unmounted() {}
}
// 函数简写, 只会触发mounted额updated钩子函数
const vMove1: Directive = (el: HTMLElement, bingd: DirectiveBinding<Dir>) => {
  // ....
}

<div v-move:bgColor.test="{ background: 'red' }"></div>





标签:el,自定义,Directive,vnode,指令,dir
From: https://www.cnblogs.com/JunLan/p/16870281.html

相关文章

  • 自定义注解及使用
    自定义注解及使用定义一个自定义注解importjava.lang.annotation.ElementType;importjava.lang.annotation.Retention;importjava.lang.annotation.RetentionPolicy......
  • spring boot Swagger2(version=2.7.0) 注解@ApiImplicitParam的属性dataType值为”自
    转载自:https://www.bbsmax.com/A/WpdKlbDqzV/注解:@ApiImplicitParams@ApiImplicitParam   name="需注解的API输入参数",value="接收参数的意义描述",paramType="参......
  • 写过vue自定义指令吗,原理是什么?.m
    背景看了一些自定义指令的文章,但是探究其原理的文章却不多见,所以我决定水一篇。如何自定义指令?其实关于这个问题官方文档上已经有了很好的示例的,我们先来温故一下。除......
  • uniapp不使用自定义tabbar的情况下隐藏指定的tabbar
    uni给提供的api中uni.hideTabBar()是控制所有的tabbar显示和隐藏,并不能达到我们想要的效果图,但是我仔细看过文档后发现uni.setTabBarItem()中有visible这个选项控......
  • [CMake] FILE指令-Filesystem
    1FILE(GLOB<variable>2[LIST_DIRECTORIEStrue|flase])[RELETIVE<path>][CONFIGURE_DEPENDS]3[<globbing-expressions>...])4FILE(GLOB_RECURSE<......
  • 微信小程序自定义顶部导航
    一、设置自定义顶部导航Navigation是小程序的顶部导航组件,当页面配置navigationStyle设置为custom的时候可以使用此组件替代原生导航栏。1.全局顶部导航自定义,在......
  • 小程序自定义组件以及页面之间的数据传递
    1、自定义组件接收页面传递过来的数据首先在组件的属性列表properties中设置数据类型以及默认值,然后再在引用组件的页面上设置相应的接收数据的名字以及数据内容(跟小程序......
  • 创建vue自定义指令
    title:创建自定义指令在组件标签的使用中,我们经常使用一些指令,例如v-for/v-model,在这里我们学习一下如何实现一个自定义指令,如何写一个自己想要实现的自定义指令功能,最......
  • SQL自定义函数
     存储函数和存储过程统称为存储例程(storeroutine),存储函数的限制比较多,例如不能用临时表,只能用表变量,而存储过程的限制较少,存储过程的实现功能要复杂些,而函数的......
  • MySQL自定义函数
    首先,做一个热身。引进一个系统函数LAST_INSERT_ID();这个函数的功能就是放回上一次插入的数据的id做个示范插入数据                       ......