码迷,mamicode.com
首页 > 其他好文 > 详细

解决element组件input框的autofocus只触发一次

时间:2019-11-03 12:57:56      阅读:569      评论:0      收藏:0      [点我收藏+]

标签:焦点   mode   asc   -name   NPU   标签   点击   his   java   

<i class="icon iconfont icon-edit-p" v-if="!editAtlasBool" @click="showInput"></i>
<el-input v-if="editAtlasBool" :placeholder="newAtlasName" ref="atlas-name-input" v-model="atlasName"  maxlength="20" @blur="atlasBlur(atlasName)"></el-input>
<i class="icon iconfont icon-edit-p" v-if="!editAtlasBool" @click="showInput"></i>

现在的需求是当点击icon图标的时候input框 与span标签切换显示,默认input框显示的时候需要自动获取焦点,首次点击icon是可以的 后面再次切换就不行,原先是在el-input标签上面添加了autofocus属性

可以使用原生的focus事件自动触发

        showInput(){
                this.editAtlasBool = true
                this.$nextTick(()=>{ //自动获取焦点 element组件autofocus失效
                    this.$refs[‘atlas-name-input‘].$refs.input.focus()
                })
            },
                        

  

解决element组件input框的autofocus只触发一次

标签:焦点   mode   asc   -name   NPU   标签   点击   his   java   

原文地址:https://www.cnblogs.com/tw6668/p/11785435.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!