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 。

以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号