vue Antd 输入框Input自动聚焦方式
更新时间:2023年04月21日 09:37:22 作者:什么小蛋挞**
这篇文章主要介绍了vue Antd 输入框Input自动聚焦方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
vue Antd 输入框Input自动聚焦
1、从vue的实例属性$ref去调input的focus方法使其实现聚焦。
<a-input type="text ref="ainput" /> <button @click="handleChange"></button>
2、点击button自动聚焦,或其他事件需要聚焦
methods:{ handleChange(){ this.$nextTick(()=>{ this.$refs.ainput.focus() }) } }
vue中输入框聚焦,自动跳转下一个输入框
需求
点击请扫描库位,enter键触发后,跳转到下一输入框,然后自动聚焦另外一个输入框上
<el-input v-model="posName" clearable size="small" placeholder="请扫描库位" style="width: 200px" class="filter-item" @keyup.enter.native="jumpInput" /> <el-input ref="barcodeMsg" v-model="barcode" clearable size="small" placeholder="请扫描物料信息" style="width: 400px" class="filter-item" @keyup.enter.native="getSearch('material')" />
// enter键触发 jumpInput() { this.$refs.barcodeMsg.focus(); // 自动获取焦点 },
如图
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章
vue3+高德地图只展示指定市、区行政区域的地图以及遮罩反向镂空其他地区
vue大屏项目开发,客户觉得地图上的文字标注太多了,要求地图上只显示省市等主要城市的标注,这篇文章主要给大家介绍了关于vue3+高德地图只展示指定市、区行政区域的地图以及遮罩反向镂空其他地区的相关资料,需要的朋友可以参考下2024-02-02vue3.0 CLI - 2.2 - 组件 home.vue 的初步改造
这篇文章主要介绍了vue3.0 CLI - 2.2 - 组件 home.vue 的初步改造,home.vue 组件有了两个属性:navs 和 tts 属性,具体实例代码大家跟随小编一起通过本文学习吧2018-09-09
最新评论