在element-UI中使用自定义指令v-focus的问题

首先，在全局中定义一个自定义指令

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

奇怪的是在组件中使用的时候没有生效，但是在自己写的input框中可以生效，打印检查之后发现是element-UI的输入框中嵌套在div中

image.png

所以将自定义指令稍作修改即可

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