element table表格实现编辑并后台提交数据

要实现element table表格的编辑并后台提交数据，你需要进行以下几个步骤：

1. 在表格中添加编辑功能，可以通过设置`edit-config`属性来启用编辑功能：

<el-table :data="tableData" :edit-config="{trigger: 'click', mode: 'cell'}">
  ...
</el-table>

2. 在`el-table-column`标签中添加`prop`属性来绑定数据，同时将`editable`属性设置为`true`来启用编辑功能：

<el-table-column prop="name" label="Name" :editable="true"></el-table-column>
<el-table-column prop="age" label="Age" :editable="true"></el-table-column>
<el-table-column prop="address" label="Address" :editable="true"></el-table-column>

3. 监听表格的`cell-click`事件，在事件处理函数中获取点击的单元格的数据：

<el-table @cell-click="handleCellClick" ...>
  ...
</el-table>

methods: {
  handleCellClick(row, column, cell, event) {
    console.log(row, column, cell, event)
  }
}

4. 在事件处理函数中弹出一个对话框，让用户输入需要修改的数据，然后将修改后的数据提交到后台：

<el-dialog :visible.sync="dialogVisible">
  <el-form :model="formData">
    <el-form-item label="Name">
      <el-input v-model="formData.name"></el-input>
    </el-form-item>
    <el-form-item label="Age">
      <el-input v-model="formData.age"></el-input>
    </el-form-item>
    <el-form-item label="Address">
      <el-input v-model="formData.address"></el-input>
    </el-form-item>
  </el-form>
  <div slot="footer">
    <el-button @click="dialogVisible = false">Cancel</el-button>
    <el-button type="primary" @click="submitData">Submit</el-button>
  </div>
</el-dialog>

data() {
  return {
    dialogVisible: false,
    formData: {}
  }
},
methods: {
  handleCellClick(row, column, cell, event) {
    this.formData = { ...row }
    this.dialogVisible = true
  },
  submitData() {
    // 将修改后的数据提交到后台
    axios.post('/api/update', this.formData)
      .then(response => {
        // 处理提交成功的逻辑
        this.dialogVisible = false
      })
      .catch(error => {
        // 处理提交失败的逻辑
      })
  }
}

这样，就可以实现element table表格的编辑并后台提交数据了。