vue2用element-ui的表格，在表格中实现批量编辑，不用弹窗，直接操作表格，点击保存按钮，会保存编辑后的数据，并且回复复选框，还有添加按钮，点击添加按钮，表格会添加一行编辑状态的行，添加完数据，点击保存，会将添加的数据传回后端，并且复选框回复

未选中状态。

实现步骤如下：

1. 在表格中添加一个“批量编辑”按钮和一个“添加”按钮，点击这两个按钮分别触发对应的方法。

2. 在表格的数据源中添加一个“editable”字段，用于表示当前行是否处于编辑状态。

3. 在表格中添加一个复选框列，用于选择需要编辑的行。

4. 点击“批量编辑”按钮时，遍历数据源中所有被选中的行，将它们的“editable”字段设置为true，然后表格会自动进入编辑状态。

5. 点击“保存”按钮时，遍历数据源中所有处于编辑状态的行，将它们的数据提交到后端进行保存，并将它们的“editable”字段设置为false，表格会自动退出编辑状态。

6. 点击“添加”按钮时，往数据源中添加一行数据，将它的“editable”字段设置为true，表格会自动进入编辑状态。

7. 在表格中添加一个“取消”按钮，用于取消当前行的编辑状态。当点击“取消”按钮时，将当前行的数据恢复为编辑前的状态，并将它的“editable”字段设置为false，表格会自动退出编辑状态。

8. 在表格中添加一个“删除”按钮，用于删除当前行的数据。当点击“删除”按钮时，将当前行的数据从数据源中删除，并重新渲染表格。

相关问题

vue2.0 element-ui动态表格

vue2.0 element-ui动态表格可以通过多种方式实现。其中，主要有以下三种方式：

1. 表格内部显示和编辑切换：在表格中添加可编辑的单元格，在用户点击单元格时，将其切换为可编辑状态。用户可以直接在表格内进行编辑，并在编辑完成后保存数据。

2. 弹出另外一个表格编辑：当用户需要编辑某一行数据时，可以通过点击编辑按钮或其他触发方式，在页面上弹出一个表格组件，用于编辑该行数据。用户可以在弹出的表格中进行修改，并保存数据。

3. 通过样式控制：通过添加样式类或其他方式，将表格的某些单元格设置为可编辑状态。用户可以直接在这些单元格中进行编辑，并在编辑完成后保存数据。

这些方式都可以实现动态表格的编辑功能，具体选择哪种方式取决于项目的需求和设计。以上是三种常见的实现方式，你可以根据具体情况选择适合你项目的方式进行实现。<span class="em">1</span><span class="em">2</span>