写代码，elementplus 表格， 双击一行，这行都显示input框可编辑， 当鼠标离开这行， input框都隐藏

在Element Plus中创建一个表格，允许用户双击某一行时显示输入框并进行编辑，通常需要利用`v-model`绑定、事件监听以及`<el-table>`组件的自定义渲染功能。以下是基本步骤：

1. 首先，在`<template>`部分，你有一个基础的表格结构，每个单元格包含内容，同时定义一个可编辑状态的变量：

<template>
  <el-table :data="tableData" ref="table">
    <el-table-column prop="name" label="姓名"></el-table-column>
    <!-- 添加一个可编辑列 -->
    <el-table-column prop="content" label="内容" :render-cell="renderCell"></el-table-column>
  </el-table>
</template>

2. 接下来，在`methods`中定义`renderCell`函数，这个函数会在点击时切换单元格是否处于可编辑状态，并展示或隐藏输入框：

<script>
export default {
  data() {
    return {
      tableData: [
        { name: '张三', content: '原始内容' },
        // 更多数据...
      ],
      editingRow: null,
    };
  },
  methods: {
    renderCell({ row, column, rowIndex }) {
      const input = this.$createElement('input', {
        v-model: row.content,
        onDoubleClick: () => (this.editingRow = rowIndex),
        onblur: () => (this.editingRow = null), // 离开焦点时隐藏输入框
      });
      return this.editingRow === rowIndex ? input : column.label;
    },
  },
};
</script>

当你双击一行时，对应的`content`字段会变为输入框，编辑完成后松开鼠标，输入框就会消失。注意这里的`editingRow`用于跟踪当前编辑的行索引。