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>

猜你喜欢

转载自blog.csdn.net/weixin_42956406/article/details/115317793