如何解决element ui input输入框嵌套循环不聚焦问题

最新推荐文章于 2024-05-30 09:34:08 发布

原创最新推荐文章于 2024-05-30 09:34:08 发布 · 421 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #vue.js

文章展示了如何在Vue.js应用中使用v-for指令动态生成输入框，并通过点击事件(inputPaentClick)和$nextTick处理聚焦问题。代码片段中，当点击某个项时，对应索引的el-input元素会被选中并聚焦。条件判断确保特定键值的输入框（如build_time1,create_time1等）不会显示。

<div v-for="(item, key,index) in formName" :key="index" @click.stop.prevent="inputPaentClick(index)">
              <el-input :ref="'refName' + index" v-if="key !== 'build_time1' &&
              key !== 'create_time1' &&key !== 'check_time1' && key !== 'update_time1'"
              v-model="form[key]"style="width: 95%"
              ></el-input>  
 </div>

 // 解决input不聚焦的问题
    inputPaentClick(index) {
      this.$nextTick(() => {
        let ref = eval('this.$refs.refName' + index)[0]
        ref.focus()
      });
    },