Vue.js：el-input自动获取焦点通过自定义指令实现v-focus

文档

• https://v2.cn.vuejs.org/v2/guide/custom-directive.html

使用 el-input组件提供的参数autofocus 自动获取焦点，效果不是很好

Vue.js2 官网提供的示例

import Vue from 'vue'

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

如果使用el-input需要做如下改进

<el-input v-focus></el-input>

import Vue from 'vue'

Vue.directive('focus', {
  inserted(el, binding, vnode) {
    el.querySelector('input').focus()
  },
})

参考 在vue项目中引用element-ui时 让el-input 获取焦点的方法