vue3+element-plus表格插入输入框，当遍历出多个表格的时候想使用回车事件去获取下一个输入框的

小了黑了兔~

于 2022-09-03 14:25:45 发布

阅读量1.7k

点赞数

文章标签：前端 javascript 开发语言

本文链接：https://blog.youkuaiyun.com/weixin_50041614/article/details/126668709

版权

本文介绍了如何在Vue3结合Element-Plus的表格组件中，通过动态绑定ref和监听回车事件，实现在多个表格间切换输入框焦点的方法。步骤包括动态绑定DOM、存储DOM数组、回车事件处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.先使用ref动态绑定当前dom元素还有回车事件要取到下标值

<el-table-column
                  prop="result"
                  label="检查结果"
                  align="center"
                  min-width="200px"
                >
                  <template #default="scoped">
                    <el-input
                      :ref="setItemRef"
                      @input="resultInput(scoped.row)"
                      autocomplete="off"
                      @keyup.enter="
                        resultEnter(scoped.row, scoped.$index, $event)
                      "
                      v-model="scoped.row.result"
                    ></el-input>
                  </template>
                </el-table-column>

2.在最外层定义一个数组接收dom

 let itemRef = [];

3.push

最低0.47元/天解锁文章