zoukankan      html  css  js  c++  java
  • 快速掌握vue中的自定义指令

    自定义指令

    注册全局的自定义指令
    Vue.directive(),
    其中,传递两个参数,第一个参数传递的是指令的名字,第二个参数是一个对象。

    详细的例子

    // 第一个参数是指令的名称,第二个参数是一个对象。
    Vue.directive('focus', {
      bind: function (el) {
        // 注意:每个函数中呢,第一个参数永远是el, 表示被绑定了指令的那个元素,这个el参数,是一个原生的js对象
        el.focus()
      },
      // 在元素刚绑定指令的时候,元素还没有放到dom中去,这个时候,调用focus方法没有作用
      // 因为一个元素只有插入dom之后,才能获取焦点
      inserted: function (el) {
        el.focus()
      },
    })
    

    对象,我们介绍三个方法

    bind:

    每当指令绑定到元素上的时候,会立即执行bind函数,只执行一次

    inserted

    表示元素插入到dom中的时候,会执行inserted函数

    updated

    当window更新的时候,会执行updated,可能会触发多次。

    总结 在使用的时候,需要给指令前加一个v-

  • 相关阅读:
    面试题 16.07. 最大数值
    461. 汉明距离
    1290. 二进制链表转整数
    1486. 数组异或操作
    1480. 一维数组的动态和
    面试题 17.04. 消失的数字
    626. 换座位
    125. 验证回文串
    530. 二叉搜索树的最小绝对差
    ASP.NET页面之间传递值的几种方式
  • 原文地址:https://www.cnblogs.com/yaogengzhu/p/11087396.html
Copyright © 2011-2022 走看看