vxe-table 显示编辑框

vxe-table是Vue.js中一款强大的表格组件，它提供了丰富的功能和高度可定制化的选项。如果你想要在vxe-table中显示编辑框，通常可以通过以下几个步骤实现：

1. **启用列编辑**：首先，你需要在你的`<x-table>`组件中配置列（columns）支持编辑。这可以通过设置`edit`属性为`true`或`{ type: 'cell', mode: 'row' }`来开启单元格级别的编辑或是行级别的编辑。

<x-table :columns="editableColumns" :edit="{ type: 'cell', mode: 'row' }"></x-table>

这里`editableColumns`应该是一个数组，包含每个列的信息，可能包括`field`（字段名）、`title`（标题）以及编辑相关的配置。

2. **提供编辑按钮或操作**：为了触发编辑，你可以在表头或者是每个单元格中添加编辑按钮，点击后会弹出输入框让用户进行修改。

3. **事件处理**：`vxe-table`提供了`before-edit`、`on-edit`等事件，用于处理编辑开始和结束时的操作，例如保存用户更改或更新数据源。

export default {
  methods: {
    saveEditData(index, field, value) {
      // 根据索引、字段名和新值更新数据源
      this.data[index][field] = value;
    },
    onBeforeEdit({ row, column, cell }) {
      return { allow: true };
    }
  }
}