Vue.directive自定义指令

Vue.directive自定义指令

Vue内置的指令很多,v-for/v-if/v-else/v-else-if/v-model/v-bind/v-on/v-show/v-html/v-text... 但是这些指令都是比较偏向于工具化,有些时候在实现具体的业务逻辑的时候,发现不够用,如何来自定义指令.

new Vue({
    directives:{
        change:{
            bind:function(){},
            update:function(){},
            unbind:function(){}
        }
    }
})

//可以通过v-change使用

在自定义指令时,在指令的配置对象中有3个常用处理函数指令对应的操作

  • bind:只调用一次,指令第一次绑定到元素时调用.通常用来进行指令初始化操作
  • update:多次调用,传参发生变化或者页面数据发生变化时,就会执行update所指定的方法
  • unbind:只调用一次,指令与元素解绑时调用
JSRUN前端笔记, 是针对前端工程师开放的一个笔记分享平台,是前端工程师记录重点、分享经验的一个笔记本。JSRUN前端采用的 MarkDown 语法 (极客专用语法), 这里属于IT工程师。