vue-自定义指令

需求1：定义一个v-big指令，和v-text功能类似，但会把绑定的数值放大10倍。

需求2：定义一个v-fbind指令，和v-bind功能类似，但可以让其所绑定的input元素默认获取焦点。

语法：

局部使用：

directives: {
  focus: {
    // 指令的定义
    inserted: function (el) {
      el.focus()
    }
  }
}

全局使用：

配置对象时常用的三个回调：

bind:指令与元素成功绑定调用

inserted:指令所在元素被插入页面时调用

update:指令所在模板结构被重新解析时使用

需求1：

  
    

      
当前值 
      
放大值 
      计算
    

    

并且用于指令中需要操作dom,所以其中的this是window，可以拿到元素操作

配置big指令传入参数：（element,binding）

        -element:第一个参数会拿到真实dom,可以操作真实dom

        -binding:第二个参数是binding是一个对象。name是指定的名称;expression是指定表达式，由于此时是绑定的指令n;value是指定的绑定值

需求二：

    (1)函数式：（存在问题）

  
    
    

      
焦点 
      计算
    

    

出现问题：一开始并不能获取焦点 

这种由于页面一开始解析模板，并且由于指令与数据绑定时由于element还未拿到，所以执行element.focus时，并不能生效。但是由于操作n,使数据发生改变，再次执行fbind，此时能拿到element元素

（2）对象式：（使用提供的钩子函数）

 

      
焦点 
      计算