grid edit 属性

 e : Object
这个编辑事件具有以下属性:

grid - 当前gird
record - 当前要编辑的record
field - 要编辑的字段名称
value - 当前值
row - grid的行序号
column - gird上定义的要编辑的Column.
rowIdx - 正在编辑的行索引
colIdx - 正在编辑的列索引
originalValue - 字段编辑前的原始值(只有配置CellEditing的时候有效)
originalValues - 字段编辑前该行的原始值(只有配置RowEditing的时候有效)
newValues - 要设置的新值(只有配置RowEditing的时候有效)
view - 这个grid的视图 (只有配置RowEditing的时候有效)
store - 当前grid的store (只有配置RowEditing的时候有效)
eOpts : Object
The options object passed to Ext.util.Observable.addListener. 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
对于vxe-grid,您可以按照以下步骤进行表格编辑: 1. 安装vxe-table:您需要确保已经安装了vxe-table库。您可以使用npm或yarn来安装: ```bash npm install vxe-table @vxe-table/plugin-antd ``` 或 ```bash yarn add vxe-table @vxe-table/plugin-antd ``` 2. 导入和注册组件:在您的Vue组件中,您需要导入并注册vxe-table组件和所需的插件: ```javascript import 'vxe-table/lib/style.css'; import { VXETable, Table, Column, AntdGrid } from 'vxe-table'; import 'vxe-table-plugin-antd/dist/style.css'; VXETable.use(AntdGrid); Vue.use(Table); Vue.use(Column); ``` 3. 创建表格:在模板中创建vxe-grid组件并设置必要的属性和事件处理程序: ```html <template> <div> <vxe-grid :data="tableData" :columns="tableColumns" @edit-closed="onEditClosed" @edit-actived="onEditActived" ></vxe-grid> </div> </template> ``` 4. 设置数据和列:在您的Vue组件中,设置表格的数据和列属性。例如: ```javascript data() { return { tableData: [ { id: 1, name: 'John Doe', age: 25 }, { id: 2, name: 'Jane Smith', age: 30 }, // more data... ], tableColumns: [ { field: 'id', title: 'ID' }, { field: 'name', title: 'Name', editRender: { name: 'input' } }, { field: 'age', title: 'Age', editRender: { name: 'input' } }, // more columns... ], }; }, ``` 5. 处理编辑事件:添加相关的事件处理程序方法。例如,您可以在方法中更新表格数据: ```javascript methods: { onEditActived(params) { // 处理编辑开始事件 // 可以在这里进行一些处理,例如保存之前的数据等 }, onEditClosed(params) { // 处理编辑结束事件 // 可以在这里更新表格数据 this.tableData = params.afterData; }, }, ``` 这是一个基本的vxe-grid表格编辑的示例。您可以根据您的需要进行进一步的自定义和配置。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值