项目场景:
vue2/3定位光标位置,重新获取焦点
问题描述
在vue中我用到了elementui组件里的select选择器需要将光标定位到需要输入的地方,但是根据ui上面的方法是肯定没问题的,但是不能保证人人都是百分之百原模原样的生效
我就遇到了bug,我明明调用的这个focus重新获取焦点,但是网页报错大概意思是:这个组件没有定义的意思,网上也有说用定时器的这个定时器确实可以做到,但是也不是百分之百就能完全生效,我反正没解决还得自己找原因
原因分析:
我最开始使用的选择器来进行绑定的,id和class我都试了都是报错focus为null没有定义之类的错误,计时器也用了没解决但我肯定是绑定传值有问题,在网上搜了下关于focus不生效的原因发现,这里需要用ref来解决,具体操作如下:
解决方案:
<el-select ref="input_idname" filterable remote reserve-keyword placeholder="请输入关键词" :remote-method="remoteMethod" :loading="loading">
<el-option v-for="item in options" :key="item.value" :label="item.icd_code+' '+item.icd_name" :value="item.icd_name"@click="handleClickerss(item)"></el-option>
</el-select>
<el-select ref="input_idname" filterable remote reserve-keyword placeholder="请输入关键词" :remote-method="remoteMethod" :loading="loading">
<el-option v-for="item in options" :key="item.value" :label="item.icd_code+' '+item.icd_name" :value="item.icd_name"@click="handleClickerss(item)"></el-option>
</el-select>
const shortEdit=function(){
_this.$refs.input_idname.focus()
}
const shortEdit=function(){
_this.$refs.input_idname.focus()
}
最后将你的方法放到你需要调用的地方即可