Vue中使input和el-input自动获取焦点的处理

一、【普通<input>的自定义指令操作】：先在入口文件注册一个全局自定义指令

// main.js
Vue.directive('focus', {
  inserted (el, binding, vnode) {
    // 聚焦元素
    el.focus()
  }
})

【普通<input>的自定义指令使用】：v-"+指令名"

// index.vue
<input v-focus placeholder="因为有v-focus,所以我聚焦了" />

二、【<el-input>的自定义指令操作】：先在入口文件注册一个全局自定义指令

// main.js
Vue.directive('fo', {
  inserted (el, binding, vnode) {
    // 聚焦元素
    el.querySelector('input').focus()
  }
})

【<el-input>的自定义指令使用】：v-"+指令名"

// index.vue
<el-input v-fo placeholder="因为有v-fo,所以我聚焦了"></el-input>

分析：通过自定义指令来实现