• 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 钩子中可用。

  • 相关阅读:
    python中时间日期格式化符号的含义
    关于long long int和__int64用%I64d和%lld输出在不同编译语言下的正确性
    并查集 poj2236
    数据结构 最长公共子序列问题
    449B
    oj判题WA/RE怎么办
    如何准确区别python中strftime strptime的用法
    通过HttpWebRequest在后台对WebService进行调用 【转】
    利用maven 下依赖包
    Maven的安装
  • 原文地址:https://www.cnblogs.com/chenyudi/p/12596080.html
Copyright © 2020-2023  润新知