React EasyUI 基本表格
2020-06-24 12:00 更新
属性列表
| 名称 | 数据类型 | 作用描述 | 默认值 |
|---|---|---|---|
| data | array | 要加载的数据行。 | [ ] |
| footerData | array | 加载的页脚数据行。 | [ ] |
| rowHeight | number | 行高度。 | 32 |
| rowCss | Object, Function | 行CSS样式。值可以是style类, 内联样式或返回样式类或内联样式的自定义函数。 | null |
| frozenWidth | number, string | 冻结视图宽度。 | 200px |
| frozenAlign | string | 冻结视图对齐。可选的值:'left', 'right'。 | left |
| sorts | Object, Array | 初始化类。 | [ ] |
| multiSort | boolean | 是否启用多列排序。 | false |
| showHeader | boolean | 是否显示列标题。 | true |
| showFooter | boolean | 是否显示页脚行。 | false |
| editMode | string | 编辑模式。可选的值:'row', 'cell'。 | null |
| clickToEdit | boolean | 定义单击单元格时是否进行编辑。 | false |
| dblclickToEdit | boolean | 定义双击单元格时是否编辑。 | false |
rowCss属性代码实例:
css: (row) => {
if (row.itemid == 'EST-11'){
return {background:'#b8eecf',fontSize:'14px',fontStyle:'italic'};
}
return null;
}
sorts属性代码实例:
sorts: [{field:'itemid',order:'desc'}]
事件列表
| 名称 | 参数 | 作用描述 |
|---|---|---|
| onRowlClick | row | 当单击一行时触发。 |
| onRowDblClick | row | 当双击一行时触发。 |
| onCellClick | {row, column} | 当单击单元格时触发。 |
| onCellDblClick | {row, column} | 当双击单元格时触发。 |
| onRowContextMenu | {row, originalEvent} | 当右击一行时触发。 |
| onCellContextMenu | {row, column, originalEvent} | 右击单元格时触发。 |
| onPageChange | {pageNumber, pageSize} | 当页面更改时触发。 |
| onEditBegin | {row, column, originalValue} | 开始编辑行或单元格时触发。 |
| onEditEnd | {row, column, originalValue} | 在结束编辑行或单元格时触发。 |
| onEditCancel | {row, column, originalValue} | 取消编辑行或单元格时触发。 |
方法列表
| 名称 | 参数 | 返回值 | 作用描述 |
|---|---|---|---|
| beginEdit | row, column | void | 开始编辑行或单元格。 |
| endEdit | none | void | 结束当前编辑行或单元格。 |
| cancelEdit | none | void | 取消当前编辑行或单元格。 |
注:
- 继承: ListBase 。
以上内容是否对您有帮助:

免费 AI IDE


更多建议: