vue2中element表格行怎么写编辑功能 需要点击编辑弹出窗口编辑后确定或者取消

可以在 element UI 的表格中通过 slot 来实现编辑功能。具体实现步骤如下：

1. 在表格中添加操作列，通过 slot-scope 属性来自定义操作列的内容。

<el-table :data="tableData">
  <el-table-column prop="name" label="姓名"></el-table-column>
  <el-table-column prop="age" label="年龄"></el-table-column>
  <el-table-column label="操作">
    <template slot-scope="scope">
      <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button>
      <el-button type="text" @click="handleDelete(scope.row)">删除</el-button>
    </template>
  </el-table-column>
</el-table>

2. 在组件中添加弹窗用于编辑数据，通过 v-if 控制弹窗的显示状态。

<el-dialog :visible.sync="dialogVisible" title="编辑" @close="handleClose">
  <el-form ref="form" :rules="rules" :model="editForm">
    <el-form-item label="姓名" prop="name">
      <el-input v-model="editForm.name"></el-input>
    </el-form-item>
    <el-form-item label="年龄" prop="age">
      <el-input-number v-model="editForm.age"></el-input-number>
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="handleClose">取消</el-button>
    <el-button type="primary" @click="handleSubmit">确定</el-button>
  </div>
</el-dialog>

3. 在组件中添加 data 属性，用于存储表格数据和编辑数据，通过方法控制弹窗的显示和隐藏以及保存编辑数据。

export default {
  data() {
    return {
      tableData: [], // 表格数据
      editForm: {}, // 编辑数据
      dialogVisible: false, // 弹窗的显示状态
      rules: { // 表单校验规则
        name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
        age: [
          { required: true, message: '请输入年龄', trigger: 'blur' },
          { type: 'number', message: '年龄必须为数字', trigger: 'blur' }
        ]
      }
    };
  },
  methods: {
    handleEdit(row) {
      // 将表格数据赋值给编辑数据
      this.editForm = { ...row };
      this.dialogVisible = true; // 显示弹窗
    },
    handleDelete(row) {
      // 发送请求删除数据
      // 删除成功后，从表格数据中删除该条数据
      const index = this.tableData.findIndex(item => item.id === row.id);
      this.tableData.splice(index, 1);
    },
    handleClose() {
      this.dialogVisible = false; // 隐藏弹窗
    },
    handleSubmit() {
      // 表单校验
      this.$refs.form.validate(valid => {
        if (valid) {
          // 发送请求更新数据
          // 更新成功后，将编辑数据赋值给表格数据
          const index = this.tableData.findIndex(item => item.id === this.editForm.id);
          this.tableData.splice(index, 1, { ...this.editForm });
          this.dialogVisible = false; // 隐藏弹窗
        }
      });
    }
  }
};

需要注意的是，这里使用了 element UI 的表单组件和表单校验功能，需要在组件中引入相应的组件和方法。