vue+iview 動態生成的input組件只能獲取一次焦點問題

用的iview框架,觸發Input的自動獲取焦點的功能:html

1585206010096.jpg

可是動態生成的input組件只能獲取一次焦點框架

上代碼
htmliview

<div v-for="(info,index) in pageInfo.data" :key="info.fid">
    <span  v-if="currentIndex_file !== index"  @click="getcurFile(index)" >{{info.positionName}}</span>
    <Input  v-show="currentFile === index" @on-blur="directModify(info.fid,index)" :ref="'file'+index"></Input>
</div>

jsthis

//data值
data() {
    return {
        this.currentIndex_file = null;
        this.currentFile = null;
    }
},
//methods方法
methods:{
    getcurFile(index){
      this.currentIndex_file = index;
      //將當前的賦值給currentIndex
      this.currentFile = index;
      //寫在$nextTick,動態獲取ref
      this.$nextTick(()=>{
        this.$refs['file'+index][0].focus()
      })
    }
}

完美解決~spa

相關文章
相關標籤/搜索