zoukankan      html  css  js  c++  java
  • vue的自定义指令。directive

    在vue中有很多vue自带的指令,比如v-heml、v-for、v-if,v-on、v-bind、v-else、v-show。

    但是这些指令还不够我们使用的。就有了directive这个对象。

    这个使使用起来也很简单

    全局指令创建

     组件里的指令

    上面是简单的使用。接下来我们来看一下,他的几个钩子函数

    bind:只调用一次,在指令第一次绑定到元素的时候,调用

    inserted:  被绑定元素插入到父组件的时候调用

    Update:所在组件Vnode(虚拟DOm的一种叫法)更新时调用,但是可能会在子Vnode更新之前

    componetUpdate: 所在组件的Vnode和子的vnode全部更新后调用。

    unbind:  调用一次,与元素解绑的时候调用。

    这里的钩子函数有点像vue的生命周期的感觉。

    在下面就是说一下这些钩子函数的参数

    el: 进行绑定的元素,可以直接操作Dom

    binding:  一个对象,包含了一些属性

      name:,创建的指令名。不包含v-

      value:所绑定的值

      oldvalue: 绑定的前一个值仅在  update 和 componentUpdated 钩子中可用。无论值是否改变都可用。

      expression: 字符串形式的指令表达式。

      arg:    传给指令的参数

      modifiers:  一个包含修饰符的对象。

    Vnode:  :Vue 编译生成的虚拟节点。

    oldVnode    上一个虚拟节点,仅在 update 和 componentUpdated 钩子中可用。

  • 相关阅读:
    oracle查看所有角色
    jQuery 异步提交表单实例解析
    oracle查看用户系统权限
    js中日期操作大全
    oracle 查询用户下所有表
    JS语法字典
    JS定时器例子讲解
    开源软件
    rpm的使用
    lvs+keepalived和haproxy+heartbeat区别
  • 原文地址:https://www.cnblogs.com/chenyudi/p/12596080.html
Copyright © 2011-2022 走看看