vue-07-自定义指令

1, 全局指令

在main.js中引入

// 注册一个全局自定义指令 `v-focus`
Vue.directive('focus', {
  // 当被绑定的元素插入到 DOM 中时……
  inserted: function (el) {
    // 聚焦元素
    el.focus()
  }
})

页面中使用

<div>
    <input v-focus/>

  </div>

 

2, 局部执行指令

在需要的js页面中引入

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

页面中使用

<div>
    <input v-focus/>

  </div>