首先，在全局中定義一個自定義指令

// 注冊一個全局自定義指令 `v-focus`
Vue.directive('focus', {
  // 當被綁定的元素插入到 DOM 中時……
  inserted: function (el) {
    // 聚焦元素
    console.log(el);
    el.focus()
  }
})

奇怪的是在組件中使用的時候沒有生效，但是在自己寫的input框中可以生效，打印檢查之后發(fā)現(xiàn)是element-UI的輸入框中嵌套在div中

image.png

所以將自定義指令稍作修改即可

Vue.directive('focus', {
  // 當被綁定的元素插入到 DOM 中時……
  inserted: function (el) {
    // 聚焦元素
    console.log(el.children[0]);
    el.children[0].focus()
  }
})