<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() }) },