当前位置: 首页 > 工具软件 > UI Table Edit > 使用案例 >

element ui table中显示input时自动聚焦

陈博容
2023-12-01

在 element-ui table 中,你可以在表格的单元格中使用 input 组件。要实现自动聚焦,你可以在 input 组件上使用 ref 属性,并使用 Vue 的 $refs 对象来访问它,然后使用 JavaScript 的 focus() 方法将焦点移动到 input 组件上。

例如,在你的 table 组件中,你可以这样写:

<template>
  <el-table>
    <el-table-column label="Name">
      <template slot-scope="scope">
        <el-input v-model="scope.row.name" ref="input"></el-input>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  methods: {
    focusInput() {
      this.$refs.input.focus()
    }
  }
}
</script>
 类似资料: