import { RenderFunction, SetupContext, Ref, ComputedRef, ComponentPublicInstance, ComponentInternalInstance, VNode } from 'vue' import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, VNodeStyle, SlotVNodeType } from './component' import { VxeTableProEmits, VxeTableProDefines } from './plugins/pro' import { VxeColumnPropTypes, VxeColumnProps, VxeColumnSlotTypes } from './column' import { VXETableConfigOptions, VxeGlobalRendererHandles } from './v-x-e-table' import { VxeToolbarConstructor, VxeToolbarInstance } from './toolbar' import { VxeTooltipInstance } from './tooltip' import { VxeGridConstructor } from './grid' import { VxeMenuPanelInstance } from './menu' /* eslint-disable no-use-before-define */ /** * 组件 - 表格 * @example import { VxeTable } from 'vxe-components' */ export const VxeTable: VXEComponent, VxeTableEventProps, VxeTableSlots> /** * 组件 - 表格 */ export const Table: typeof VxeTable export type VxeTableInstance = ComponentPublicInstance, VxeTableConstructor> export type VxeTableDataRow = Record export interface VxeTableConstructor extends VxeComponentBase, VxeTableMethods { props: Readonly> context: SetupContext instance: ComponentInternalInstance reactData: TableReactData internalData: TableInternalData getRefMaps(): TablePrivateRef getComputeMaps(): TablePrivateComputed renderVN: RenderFunction xegrid: VxeGridConstructor | null } export interface TablePrivateRef { refElem: Ref refTooltip: Ref refValidTooltip: Ref refTableFilter: Ref refTableMenu: Ref refTableHeader: Ref refTableBody: Ref refTableFooter: Ref refTableLeftHeader: Ref refTableLeftBody: Ref refTableLeftFooter: Ref refTableRightHeader: Ref refTableRightBody: Ref refTableRightFooter: Ref refLeftContainer: Ref refRightContainer: Ref refCellResizeBar: Ref } export interface VxeTablePrivateRef extends TablePrivateRef { } export interface TablePrivateComputed { computeSize: ComputedRef computeValidOpts: ComputedRef> computeSXOpts: ComputedRef computeSYOpts: ComputedRef computeColumnOpts: ComputedRef computeRowOpts: ComputedRef computeResizeleOpts: ComputedRef computeResizableOpts: ComputedRef> computeSeqOpts: ComputedRef> computeRadioOpts: ComputedRef> computeCheckboxOpts: ComputedRef> computeTooltipOpts: ComputedRef> computeEditOpts: ComputedRef> computeSortOpts: ComputedRef> computeFilterOpts: ComputedRef> computeMouseOpts: ComputedRef computeAreaOpts: ComputedRef computeKeyboardOpts: ComputedRef computeClipOpts: ComputedRef> computeFNROpts: ComputedRef> computeHeaderMenu: ComputedRef computeBodyMenu: ComputedRef computeFooterMenu: ComputedRef computeIsMenu: ComputedRef computeMenuOpts: ComputedRef> computeExportOpts: ComputedRef computeImportOpts: ComputedRef computePrintOpts: ComputedRef computeExpandOpts: ComputedRef> computeTreeOpts: ComputedRef> computeEmptyOpts: ComputedRef computeLoadingOpts: ComputedRef computeCustomOpts: ComputedRef> computeFixedColumnSize: ComputedRef computeIsMaxFixedColumn: ComputedRef computeIsAllCheckboxDisabled: ComputedRef } export type VxeTablePrivateComputed = TablePrivateComputed export interface TableMethods extends TablePublicMethods { dispatchEvent(type: ValueOf, params: any, evnt: Event | null): void } export interface TablePublicMethods
{ /** * 手动清除表格所有条件,还原到初始状态 * 对于增删改查的场景中可能会用到,比如在数据保存之后清除表格缓存 */ clearAll(): Promise /** * 该方法已废弃!!! * 同步 data 数据;如果用了该方法,那么组件将不再记录增删改的状态,只能自行实现对应逻辑 * 对于某些特殊的场景,比如深层树节点元素发生变动时可能会用到 * @deprecated */ syncData(): Promise /** * 手动处理数据,用于手动排序与筛选 * 对于手动更改了排序、筛选...等条件后需要重新处理数据时可能会用到 */ updateData(): Promise /** * 加载数据 * @param data 数据 */ loadData(data: any[]): Promise /** * 加载数据并恢复到初始状态 * @param data 数据 */ reloadData(data: any[]): Promise /** * 局部加载行数据并恢复到初始状态 * @param rows 行对象 * @param record 新数据 * @param field 指定字段名 */ reloadRow(rows: any | any[], record?: any, field?: string): Promise /** * 用于树结构,给行数据加载子节点 * @param row 行对象 * @param children 子节点 */ loadTreeChildren(row: any, children: any[]): Promise /** * 加载列配置 * @param columns 列对象 */ loadColumn(columns: (VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo)[]): Promise /** * 加载列配置并恢复到初始状态 * @param columns 列对象 */ reloadColumn(columns: (VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo)[]): Promise /** * 根据 tr 元素获取对应的 row 信息 * @param tr 行节点元素 */ getRowNode(trElem: HTMLElement): { rowid: string item: any items: any[] index: number parent?: any } | null /** * 根据 th/td 元素获取对应的 column 信息 * @param cell 单元格节点元素 */ getColumnNode(cellElem: HTMLElement): { colid: string item: VxeTableDefines.ColumnInfo
items: VxeTableDefines.ColumnInfo
[] index: number parent?: VxeTableDefines.ColumnInfo
} | null /** * 根据 row 获取行的序号 * @param row 行对象 */ getRowSeq(row: any): string | number /** * 根据 row 获取相对于 data 中的索引 * @param row 行对象 */ getRowIndex(row: any): number /** * 根据 row 获取相对于当前数据中的索引 * @param row 行对象 */ getVTRowIndex(row: any): number /** * 根据 row 获取渲染中的虚拟索引 * @param row 行对象 */ getVMRowIndex(row: any): number /** * 根据 column 获取相对于 columns 中的索引 * @param column 列对象 */ getColumnIndex(column: VxeTableDefines.ColumnInfo): number /** * 根据 column 获取相对于当前表格列中的索引 * @param column 列对象 */ getVTColumnIndex(column: VxeTableDefines.ColumnInfo): number /** * 根据 column 获取渲染中的虚拟索引 * @param column 列对象 */ getVMColumnIndex(column: VxeTableDefines.ColumnInfo): number /** * 创建 data 对象 * 对于某些特殊场景可能会用到,会自动对数据的字段名进行检测,如果不存在就自动定义 * @param records 数据 */ createData(records: any[]): Promise /** * 创建 Row|Rows 对象 * 对于某些特殊场景需要对数据进行手动插入时可能会用到 * @param records 数据 */ createRow(records: any | any[]): Promise /** * 只对 keep-source 开启有效,还原指定行 row 或者整个表格的数据 * @param rows 指定行 * @param field 字段名 */ revertData(rows?: any | any[], field?: string): Promise /** * 手动清空单元格内容,如果不传参数,则清空整个表格内容,如果传了行则清空指定行内容,如果传了指定字段,则清空该字段内容 * @param rows 指定行 * @param field 字段名 */ clearData(rows?: any | any[], field?: string): Promise /** * 用于 edit-config,判断行是否为新增的临时数据 * @param row 指定行 */ isInsertByRow(row: any): boolean /** * 删除所有新增的临时数据 */ removeInsertRow(): Promise<{ row: any, rows: any[] }> /** * 只对 keep-source 开启有效,判断行数据是否发生改变 * @param row 指定行 * @param field 指定字段 */ isUpdateByRow(row: any, field?: string): boolean /** * 获取表格的可视列,也可以指定索引获取列 * @param columnIndex 列索引 */ getColumns(): VxeTableDefines.ColumnInfo
[] getColumns(columnIndex?: number): VxeTableDefines.ColumnInfo
/** * 根据列的唯一主键获取列 * @param colid 列主键 */ getColumnById(colid: string): VxeTableDefines.ColumnInfo
| null /** * 根据列的字段名获取列 * @param field 字段名 */ getColumnByField(field: string): VxeTableDefines.ColumnInfo
| null /** * 获取当前表格的列 * 收集到的全量列、全量表头列、处理条件之后的全量表头列、当前渲染中的表头列 */ getTableColumn(): { collectColumn: VxeTableDefines.ColumnInfo
[] fullColumn: VxeTableDefines.ColumnInfo
[] visibleColumn: VxeTableDefines.ColumnInfo
[] tableColumn: VxeTableDefines.ColumnInfo
[] } /** * 获取数据,和 data 的行为一致,也可以指定索引获取数据 */ getData(): DT[] getData(rowIndex: number): DT /** * 用于 type=checkbox,获取已选中的行数据 */ getCheckboxRecords(isFull?: boolean): DT[] /** * 只对 tree-config 有效,获取行的父级 */ getParentRow(rowOrRowid: any): DT | null /** * 根据行的唯一主键获取行 * @param rowid 行主键 */ getRowById(rowid: string | number): DT | null /** * 根据行获取行的唯一主键 * @param row 行对象 */ getRowid(row: any): string /** * 获取当前表格的数据 * 完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据 */ getTableData(): { fullData: DT[] visibleData: DT[] tableData: DT[] footerData: DT[][] } /** * 设置指定列为固定列 * @param columnOrField 列对象或字段名 */ setColumnFixed(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo, fixed: VxeColumnPropTypes.Fixed): Promise /** * 取消指定的固定列 * @param columnOrField 列对象或字段名 */ clearColumnFixed(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise /** * 隐藏指定列 * @param columnOrField 列对象或字段名 */ hideColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise /** * 显示指定列 * @param columnOrField 列对象或字段名 */ showColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise /** * 设置列宽 * @param fieldOrColumn 列对象或字段名 * @param width 宽度 %,px */ setColumnWidth(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo, width: number | string): Promise /** * 获取列宽 * @param fieldOrColumn 列对象或字段名 */ getColumnWidth(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): number; /** * 手动重置列的显示隐藏、列宽拖动的状态;如果为 true 则重置所有状态 * 如果已关联工具栏,则会同步更新 * @param options 可选参数 */ resetColumn(options?: boolean | { visible?: boolean resizable?: boolean fixed?: boolean order?: boolean }): Promise /** * 刷新列配置 * 对于动态修改属性、显示/隐藏列等场景下可能会用到 */ refreshColumn(): Promise /** * 刷新滚动操作,手动同步滚动相关位置 * 对于某些特殊的操作,比如滚动条错位、固定列不同步 */ refreshScroll(): Promise /** * 重新计算表格,如果传 true 则进行完整计算 * 对于某些特殊场景可能会用到,比如隐藏的表格、重新计算列宽...等 */ recalculate(refull?: boolean): Promise /** * 打开 tooltip 提示 * @param target 目标元素 * @param content 内容 */ openTooltip(target: HTMLElement, content: string | number): Promise /** * 关闭 tooltip 提示 */ closeTooltip(): Promise /** * 用于 type=checkbox,设置行为选中状态,第二个参数为选中与否 * @param rows 指定行 * @param checked 是否选中 */ setCheckboxRow(rows: any | any[], checked: boolean): Promise /** * 用于 type=checkbox,判断列头复选框是否被选中 */ isAllCheckboxChecked(): boolean /** * 用于 type=checkbox,判断列头复选框是否被半选 */ isAllCheckboxIndeterminate(): boolean /** * 用于 type=checkbox,判断复选行数据是否勾选 * @param row 指定行 */ isCheckedByCheckboxRow(row: any): boolean /** * 用于 type=checkbox,判断复选行数据是否半选 * @param row 指定行 */ isIndeterminateByCheckboxRow(row: any): boolean /** * 用于 type=checkbox,切换某一行的选中状态 * @param row 指定行 */ toggleCheckboxRow(row: any): Promise /** * 用于 type=checkbox,设置所有行的选中状态 * @param checked 是否选中 */ setAllCheckboxRow(checked: boolean): Promise /** * 用于 radio-config.reserve,获取已保留选中的行数据 */ getRadioReserveRecord(isFull?: boolean): any[] /** * 用于 radio-config.reserve,手动清空用户保留选中的行数据 */ clearRadioReserve(): Promise /** * 用于 checkbox-config.reserve,获取已保留选中的行数据 */ getCheckboxReserveRecords(isFull?: boolean): any[] /** * 用于 type=checkbox,获取半选状态的行数据 */ getCheckboxIndeterminateRecords(isFull?: boolean): any[] /** * 用于 checkbox-config.reserve,手动清空用户保留选中的行数据 */ clearCheckboxReserve(): Promise /** * 用于 type=checkbox,切换所有行的选中状态 */ toggleAllCheckboxRow(): Promise /** * 用于 type=checkbox,手动清空用户的选择 */ clearCheckboxRow(): Promise /** * 用于 row-config.isCurrent,设置某一行为高亮状态 * @param row 指定行 */ setCurrentRow(row: any): Promise /** * 用于 type=radio,判断单选行数据是否勾选 * @param row 指定行 */ isCheckedByRadioRow(row: any): boolean /** * 用于 type=radio,设置某一行为选中状态 * @param row 指定行 */ setRadioRow(row: any): Promise /** * 将指定行设置为取消/标记待删除状态 */ setPendingRow(rows: any | any[], status: boolean): Promise /** * 切换指定行的取消/标记待删除状态 */ togglePendingRow(rows: any | any[]): Promise /** * 获取待删除状态的数据 */ getPendingRecords(): DT[] /** * 判断行是否为待删除状态 * @param row 指定行 */ hasPendingByRow(row: any): boolean /** * 清除所有标记状态 */ clearPendingRow(): Promise /** * 手动清除临时合并的单元格 */ clearMergeCells(): Promise /** * 手动清除临时合并的表尾 */ clearMergeFooterItems(): Promise /** * 用于 row-config.isCurrent,手动清空当前高亮的状态 */ clearCurrentRow(): Promise /** * 用于 type=radio,手动清空用户的选择 */ clearRadioRow(): Promise /** * 获取临时合并的单元格 */ getMergeCells(): VxeTableDefines.MergeInfo[] /** * 获取临时合并的表尾 */ getMergeFooterItems(): VxeTableDefines.MergeInfo[] /** * 用于 column-config.isCurrent,获取当前列 */ getCurrentColumn(): VxeTableDefines.ColumnInfo
| null /** * 用于 row-config.isCurrent,获取当前行的行数据 */ getCurrentRecord(): DT | null /** * 用于 type=radio,获取当已选中的行数据 */ getRadioRecord(isFull?: boolean): DT | null /** * 用于 column-config.isCurrent,设置某列行为高亮状态 * @param columnOrField 列对象或字段名 */ setCurrentColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise /** * 用于 column-config.isCurrent,手动清空当前高亮的状态 */ clearCurrentColumn(): Promise /** * 手动对表格进行排序 * @param sortConfs 字段名、多列排序 * @param order 排序方式 */ sort(field: string, order?: VxeTablePropTypes.SortOrder): Promise sort(sortConfs: VxeTableDefines.SortConfs, order?: VxeTablePropTypes.SortOrder): Promise sort(sortConfs: VxeTableDefines.SortConfs[], order?: VxeTablePropTypes.SortOrder): Promise /** * 手动清空排序条件,数据会恢复成未排序的状态 * @param columnOrField 列对象或字段名 */ clearSort(fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | null): Promise /** * 判断指定列是否为排序状态,如果为空则判断所有列 * @param columnOrField 列对象或字段名 */ isSort(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): boolean /** * 获取当前排序的列信息 */ getSortColumns(): VxeTableDefines.SortCheckedParams[] /** * 手动关闭筛选面板 */ closeFilter(): Promise /** * 已废弃,请使用 isActiveFilterByColumn * @deprecated */ isFilter(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): boolean /** * 判断指定列是否为筛选状态,如果为空则判断所有列 * @param columnOrField 列对象或字段名 */ isActiveFilterByColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): boolean /** * 用于 expand-config.lazy,用于懒加载展开行,判断展开行是否懒加载完成 * @param row 指定行 */ isRowExpandLoaded(row: any): boolean /** * 用于 expand-config.lazy,手动清空懒加载展开行的状态,数据会恢复成未展开的状态,当再次展开时会重新加载 */ clearRowExpandLoaded(row: any): Promise /** * 重新懒加载展开行,并展开内容 * @param row 指定行 */ reloadRowExpand(row: any): Promise /** * @deprecated 已废弃,请使用 reloadRowExpand */ reloadExpandContent(row: any): Promise /** * 用于 type=expand,切换展开行的状态 * @param row 指定行 */ toggleRowExpand(row: any): Promise /** * 用于 expand-config,设置所有行的展开与否 * 如果是关闭所有行,可以使用 clearRowExpand 快速清除 * @param checked 是否选中 */ setAllRowExpand(checked: boolean): Promise /** * 用于 expand-config,设置展开行,二个参数设置这一行展开与否 * @param rows 指定行 * @param checked 是否选中 */ setRowExpand(rows: any | any[], checked: boolean): Promise /** * 用于 expand-config,判断行是否为展开状态 * @param row 指定行 */ isRowExpandByRow(row: any): boolean /** * @deprecated 已废弃,请使用 isRowExpandByRow */ isExpandByRow(row: any): boolean /** * 用于 type=expand,手动清空展开行状态,数据会恢复成未展开的状态 */ clearRowExpand(): Promise /** * 用于 type=expand,手动清空用户保留行的展开状态 */ clearRowExpandReserve(): Promise /** * 用于 expand-config,用于展开行,获取已展开的行数据 */ getRowExpandRecords(): DT[] /** * 用于 tree-config,用于树表格,获取已展开的节点 * 注意,即使父节点被收起,只要该节点还处于展开状态都能获取到 */ getTreeExpandRecords(): DT[] /** * 用于 tree-config.lazy,用于懒加载树表格,判断树节点是否懒加载完成 */ isTreeExpandLoaded(row: any): boolean /** * 用于 tree-config.lazy,手动清空懒加载树节点的状态,数据会恢复成未展开的状态,当再次展开时会重新加载 */ clearTreeExpandLoaded(row: any): Promise /** * 重新懒加载树节点,并展开该节点 * @param rows 指定行 */ reloadTreeExpand(row: any): Promise /** * @deprecated 已废弃,请使用 reloadTreeExpand */ reloadTreeChilds(row: any): Promise /** * 用于 tree-config,切换展开树形节点的状态 * @param row 指定行 */ toggleTreeExpand(row: any): Promise /** * 用于 tree-config,设置所有树节点的展开与否 * 如果是关闭所有树节点,可以使用 clearTreeExpand 快速清除 * @param checked 是否选中 */ setAllTreeExpand(checked: boolean): Promise /** * 用于 tree-config,设置展开树形节点,二个参数设置这一行展开与否 * @param rows 指定行 * @param checked 是否选中 */ setTreeExpand(rows: any | any[], checked: boolean): Promise /** * 用于 tree-config,判断行是否为树形节点展开状态 * @param row 指定行 */ isTreeExpandByRow(row: any): boolean /** * 用于 tree-config,手动清空树形节点的展开状态,数据会恢复成未展开的状态 */ clearTreeExpand(): Promise /** * 用于 tree-config.reserve,手动清空用户保留树节点的展开状态 */ clearTreeExpandReserve(): Promise /** * 获取表格的滚动状态 */ getScroll(): { virtualX: boolean virtualY: boolean scrollTop: number scrollLeft: number } /** * 如果有滚动条,则滚动到对应的位置 * @param scrollLeft 左边距离 * @param scrollTop 顶部距离 */ scrollTo(scrollLeft: number | null, scrollTop?: number | null): Promise /** * 如果有滚动条,则滚动到对应的行 * @param row 指定行 * @param columnOrField 列对象或字段名 */ scrollToRow(row: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise /** * 如果有滚动条,则滚动到对应的列 * @param columnOrField 列对象或字段名 */ scrollToColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise /** * 手动清除滚动相关信息,还原到初始状态 */ clearScroll(): Promise /** * 手动更新表尾 */ updateFooter(): Promise /** * 更新单元格状态 * @param params 插槽对象 */ updateStatus( params: { row: DT column: VxeTableDefines.ColumnInfo
}, cellValue?: any ): Promise /** * 取消单元格的临时合并状态,如果为数组,则取消多个合并 */ removeMergeCells(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise /** * 取消表尾的临时合并状态,如果为数组,则取消多个合并 */ removeMergeFooterItems(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise /** * 临时合并单元格,如果为数组则合并多个 */ setMergeCells(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise /** * 临时合并表尾,如果为数组则合并多个 */ setMergeFooterItems(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise /** * 用于 mouse-config.area,更新已选区域的单元格样式 */ updateCellAreas(): Promise /** * 连接工具栏 * @param toolbar 工具栏组件实例 */ connect(toolbar: VxeToolbarConstructor | VxeToolbarInstance): Promise /** * 使表格获取焦点 */ focus(): Promise /** * 使表格失去焦点 */ blur(): Promise } export interface VxeTableMethods extends TableMethods { } export interface TablePrivateMethods { getSetupOptions(): Required updateAfterDataIndex(): void callSlot(slotFunc: ((params: T) => SlotVNodeType | SlotVNodeType[]) | string | null, params: T): SlotVNodeType[] getParentElem(): Element | null getParentHeight(): number getExcludeHeight(): number defineField(records: any[]): any[] handleTableData(force?: boolean): Promise cacheRowMap(isSource?: boolean): void cacheSourceMap(fullData: any[]): void saveCustomResizable(isReset?: boolean): void saveCustomVisible(): void saveCustomFixed(): void analyColumnWidth(): void checkSelectionStatus(): void handleSelectRow(params: any, value: any, isForce?: boolean): void handleCustom(): Promise handleUpdateDataQueue(): void handleRefreshColumnQueue(): void preventEvent(evnt: any, type: any, args?: any, next?: any, end?: any): any calcIndeterminateTem(treeData:VxeTableDataRow[]): void triggerHeaderTitleEvent(evnt: MouseEvent, iconParams: VxeColumnPropTypes.TitlePrefix | VxeColumnPropTypes.TitleSuffix, params: VxeTableDefines.CellRenderHeaderParams): void triggerHeaderTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams): void triggerBodyTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams): void triggerFooterTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderFooterParams): void handleTargetLeaveEvent(evnt: MouseEvent): void triggerHeaderCellClickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams): void triggerHeaderCellDblclickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams): void triggerCellClickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams): void triggerCellDblclickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams): void handleToggleCheckRowEvent(evnt: Event | null, params: { row: any }): void triggerCheckRowEvent(evnt: Event, params: { row: any }, value: boolean): void triggerCheckAllEvent(evnt: MouseEvent | null, value: boolean): void triggerRadioRowEvent(evnt: Event, params: { row: any }): void triggerCurrentRowEvent(evnt: Event, params: { $table: VxeTableConstructor & VxeTablePrivateMethods row: any rowIndex: number $rowIndex: number }): void triggerRowExpandEvent(evnt: Event, params: VxeTableDefines.CellRenderBodyParams): void triggerTreeExpandEvent(evnt: Event, params: VxeTableDefines.CellRenderBodyParams): void triggerSortEvent(evnt: Event, column: VxeTableDefines.ColumnInfo, order: VxeTablePropTypes.SortOrder): void triggerScrollXEvent(evnt: Event): void triggerScrollYEvent(evnt: Event): void scrollToTreeRow(row: any): Promise updateScrollYStatus(fullData?: any[]): boolean updateScrollXSpace(): void updateScrollYSpace(): void updateScrollXData(): void updateScrollYData(): void checkScrolling(): void updateZindex(): void handleCheckedCheckboxRow(rows: any, value: boolean, isForce?: boolean): Promise triggerHoverEvent(evnt: any, params: any): void setHoverRow(row: any): void clearHoverRow(): void getCell(row: any, column: VxeTableDefines.ColumnInfo): HTMLTableDataCellElement | null getCellLabel(row: any, column: VxeTableDefines.ColumnInfo): any findRowIndexOf(list: any[], row: any): number eqRow(row1: any, row2: any): boolean } export interface VxeTablePrivateMethods extends TablePrivateMethods { } export interface TableReactData { // 低性能的静态列 staticColumns: any[] // 渲染的列分组 tableGroupColumn: any[] // 可视区渲染的列 tableColumn: any[] // 渲染中的数据 tableData: D[] // 是否启用了横向 X 可视渲染方式加载 scrollXLoad: boolean // 是否启用了纵向 Y 可视渲染方式加载 scrollYLoad: boolean // 是否存在纵向滚动条 overflowY: boolean // 是否存在横向滚动条 overflowX: boolean // 纵向滚动条的宽度 scrollbarWidth: number // 横向滚动条的高度 scrollbarHeight: number // 最后滚动时间戳 lastScrollTime: number // 行高 rowHeight: number // 表格父容器的高度 parentHeight: number // 是否使用分组表头 isGroup: boolean isAllOverflow: boolean // 复选框属性,是否全选 isAllSelected: boolean // 复选框属性,有选中且非全选状态 isIndeterminate: boolean // 复选框属性,已选中的行集合 selectCheckboxMaps: Record // 当前行 currentRow: D | null // 单选框属性,选中列 currentColumn: any // 单选框属性,选中行 selectRadioRow: D | null // 表尾合计数据 footerTableData: any[][] // 展开列信息 expandColumn: any hasFixedColumn: boolean // 已展开的行 rowExpandedMaps: Record // 懒加载中的展开行 rowExpandLazyLoadedMaps: Record // 树节点列信息 treeNodeColumn: any // 已展开树节点 treeExpandedMaps: Record // 懒加载中的树节点的集合 treeExpandLazyLoadedMaps: Record // 树节点不确定状态的集合 treeIndeterminateMaps: Record // 合并单元格的对象集 mergeList: VxeTableDefines.MergeItem[] // 合并表尾数据的对象集 mergeFooterList: VxeTableDefines.MergeItem[] // 刷新列标识,当列筛选被改变时,触发表格刷新数据 upDataFlag: number // 刷新列标识,当列的特定属性被改变时,触发表格刷新列 reColumnFlag: number // 已标记的对象集 pendingRowMaps: Record // 已标记的行 pendingRowList: any[], // 初始化标识 initStore: { filter: boolean import: boolean export: boolean }, // 当前选中的筛选列 filterStore: { isAllSelected: boolean isIndeterminate: boolean style: any options: any[] column: any multiple: boolean visible: boolean maxHeight: number | null [key: string]: any }, // 存放列相关的信息 columnStore: { leftList: VxeTableDefines.ColumnInfo[] centerList: VxeTableDefines.ColumnInfo[] rightList: VxeTableDefines.ColumnInfo[] resizeList: VxeTableDefines.ColumnInfo[] pxList: VxeTableDefines.ColumnInfo[] pxMinList: VxeTableDefines.ColumnInfo[] scaleList: VxeTableDefines.ColumnInfo[] scaleMinList: VxeTableDefines.ColumnInfo[] autoList: VxeTableDefines.ColumnInfo[] }, // 存放快捷菜单的信息 ctxMenuStore: { selected: any visible: boolean showChild: boolean selectChild: any list: any[][] style: any [key: string]: any }, // 存放可编辑相关信息 editStore: { indexs: { columns: any[] }, titles: { columns: any[] }, // 选中源 selected: { row: D | null column: any [key: string]: any }, // 已复制源 copyed: { cut: boolean rows: D[] columns: any[] [key: string]: any }, // 激活 actived: { row: D | null column: any [key: string]: any }, insertMaps: { [key: string]: any } removeMaps: { [key: string]: any } }, // 存放 tooltip 相关信息 tooltipStore: { row: D | null column: any content: any visible: boolean, currOpts: any } // 存放数据校验相关信息 validStore: { visible: boolean }, validErrorMaps: { [key: string]: { row: D | null column: any rule: any content: any } }, // 导入相关信息 importStore: { inited: boolean file: any type: any modeList: any[] typeList: any[] filename: any visible: boolean }, importParams: { mode: any types: any message: boolean }, // 导出相关信息 exportStore: { inited: boolean name: any modeList: any[] typeList: any[] columns: any[] isPrint: boolean hasFooter: boolean hasMerge: boolean hasTree: boolean hasColgroup: boolean visible: boolean }, exportParams: { filename: any sheetName: any mode: any type: any isColgroup: boolean isMerge: boolean isAllExpand: boolean useStyle: boolean original: boolean message: boolean isHeader: boolean isFooter: boolean }, scrollVMLoading: boolean _isResize: boolean } export interface TableInternalData { tZindex: number elemStore: { [key: string]: Ref | null } // 存放横向 X 虚拟滚动相关的信息 scrollXStore: { offsetSize: number visibleSize: number startIndex: number endIndex: number } // 存放纵向 Y 虚拟滚动相关信息 scrollYStore: { adaptive?: boolean rowHeight: number offsetSize: number visibleSize: number startIndex: number endIndex: number } // 表格宽度 tableWidth: number // 表格高度 tableHeight: number // 表头高度 headerHeight: number // 表尾高度 footerHeight: number customHeight: number customMinHeight: number customMaxHeight: number // 当前 hover 行 hoverRow: any // 最后滚动位置 lastScrollLeft: number lastScrollTop: number // 单选框属性,已选中保留的行 radioReserveRow: any // 复选框属性,已选中保留的行 checkboxReserveRowMap: any // 行数据,已展开保留的行集合 rowExpandedReserveRowMap: Record // 树结构数据,已展开保留的行集合 treeExpandedReserveRowMap: Record // 树结构数据,不确定状态的集合 treeIndeterminateRowMaps: Record // 列表完整数据、条件处理后 tableFullData: D[] afterFullData: D[] afterTreeFullData: D[] // 列表条件处理后数据集合 afterFullRowMaps: Record tableSynchData: D[] tableSourceData: D[] // 树的全量数据、条件处理后 tableFullTreeData: D[] // 收集的列配置(带分组) collectColumn: VxeTableDefines.ColumnInfo[], // 完整所有列(不带分组) tableFullColumn: VxeTableDefines.ColumnInfo[] // 渲染所有列 visibleColumn: VxeTableDefines.ColumnInfo[] // 缓存数据集 fullAllDataRowIdData: { [key: string]: { row: D rowid: string seq: string | number index: number $index: number _index: number items: any[] parent: any level: number treeLoaded?: boolean expandLoaded?: boolean formatData?: { [key: string]: { value: any label: any } } } } sourceDataRowIdData: Record fullDataRowIdData: { [key: string]: { row: D rowid: string seq: string | number index: number $index: number _index: number items: any[] parent: any level: number } } fullColumnIdData: { [key: string]: { column: VxeTableDefines.ColumnInfo colid: string index: number $index: number _index: number items: VxeTableDefines.ColumnInfo[] parent: VxeTableDefines.ColumnInfo } } fullColumnFieldData: { [key: string]: { column: VxeTableDefines.ColumnInfo colid: string index: number items: VxeTableDefines.ColumnInfo[] parent: VxeTableDefines.ColumnInfo } } // 特殊标识 inited: boolean tooltipTimeout: any initStatus: boolean isActivated: boolean // 内部属性 _lastResizeTime?: any _keyCtx?: any _lastCallTime?: any _importResolve?: ((...args: any[]) => any) | null _importReject?: ((...args: any[]) => any) | null _currFilterParams?: any _currMenuParams?: any } export namespace VxeTablePropTypes { export type Size = SizeType export type ID = string export type Data = T[] export type Height = number | string export type MinHeight = number | string export type MaxHeight = number | string export type Resizable = boolean export type Stripe = boolean export type Round = boolean export type Border = boolean | 'default' | 'full' | 'outer' | 'inner' | 'none' | '' export type Loading = boolean export type Align = 'left' | 'center' | 'right' | '' | null export type HeaderAlign = Align export type FooterAlign = Align export type ShowHeader = boolean export type HighlightCurrentRow = boolean export type HighlightHoverRow = boolean export type HighlightCurrentColumn = boolean export type HighlightHoverColumn = boolean export type HighlightCell = boolean export type ShowFooter = boolean export type FooterMethod = (params: { $table: VxeTableConstructor & VxeTablePrivateMethods $grid: VxeGridConstructor | null | undefined columns: VxeTableDefines.ColumnInfo[] data: D[] }) => Array[] export type RowClassName = string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods row: D rowIndex: number $rowIndex: number _rowIndex: number }) => void | null | string | { [key: string]: boolean }) export type CellClassName = string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods row: D rowIndex: number $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | string | { [key: string]: boolean }) export type HeaderRowClassName = string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | string | { [key: string]: boolean }) export type HeaderCellClassName = string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number column: VxeTableDefines.ColumnInfo fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | string | { [key: string]: boolean }) export type FooterRowClassName = string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number _rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | string | { [key: string]: boolean }) export type FooterCellClassName = string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | string | { [key: string]: boolean }) export type CellStyle = VNodeStyle | ((params: { row: D rowIndex: number $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | VNodeStyle) export type HeaderCellStyle = VNodeStyle | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number _columnIndex: number }) => void | null | VNodeStyle) export type FooterCellStyle = VNodeStyle | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number }) => void | null | VNodeStyle) export type RowStyle = VNodeStyle | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods row: D rowIndex: number $rowIndex: number _rowIndex: number }) => void | null | VNodeStyle) export type HeaderRowStyle = VNodeStyle | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | VNodeStyle) export type FooterRowStyle = VNodeStyle | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods $rowIndex: number _rowIndex: number fixed: VxeColumnPropTypes.Fixed type: string }) => void | null | VNodeStyle) export type MergeCell = VxeTableDefines.MergeOptions export type MergeCells = MergeCell[] export type MergeFooterItem = VxeTableDefines.MergeOptions export type MergeFooterItems = MergeFooterItem[] export type SpanMethod = (params: { $table: VxeTableConstructor & VxeTablePrivateMethods column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number row: D rowIndex: number $rowIndex: number _rowIndex: number isHidden: boolean fixed: VxeColumnPropTypes.Fixed type: string visibleData: D[] }) => void | { rowspan: number, colspan: number } export type FooterSpanMethod = (params: { $table: VxeTableConstructor & VxeTablePrivateMethods column: VxeTableDefines.ColumnInfo columnIndex: number _columnIndex: number $columnIndex: number $rowIndex: number _rowIndex: number items: any[] data: D[][] }) => void | { rowspan: number, colspan: number } export type ShowOverflow = boolean | 'ellipsis' | 'title' | 'tooltip' | '' | null export type ShowHeaderOverflow = ShowOverflow export type ShowFooterOverflow = ShowOverflow export type ColumnKey = boolean export type RowKey = boolean export type RowId = string export type KeepSource = boolean export type AutoResize = boolean export type SyncResize = boolean | string | number /** * 响应式布局配置项 */ export interface ResizeConfig { refreshDelay?: number } export interface ResizeOpts extends ResizeConfig { } /** * 列配置信息 */ export interface ColumnConfig { /** * 是否需要为每一列的 VNode 设置 key 属性 */ useKey?: boolean /** * 当鼠标点击列头时,是否要高亮当前列 */ isCurrent?: boolean /** * 当鼠标移到列头时,是否要高亮当前头 */ isHover?: boolean /** * 每一列是否启用列宽调整 */ resizable?: VxeColumnPropTypes.Resizable /** * 每一列的宽度 */ width?: VxeColumnPropTypes.Width /** * 每一列的最小宽度 */ minWidth?: VxeColumnPropTypes.MinWidth /** * 每一列的最大宽度 */ maxWidth?: VxeColumnPropTypes.MaxWidth /** * 固定列允许设置的最大数量(如果是分组,则一个分组算一个) */ maxFixedSize?: number /** * 每一列的自定义表头单元格数据导出方法,返回自定义的标题 */ headerExportMethod?: VxeColumnPropTypes.HeaderExportMethod /** * 每一列的自定义单元格数据导出方法,返回自定义的值 */ exportMethod?: VxeColumnPropTypes.ExportMethod /** * 每一列的自定义表尾单元格数据导出方法,返回自定义的值 */ footerExportMethod?: VxeColumnPropTypes.FooterExportMethod } export interface ColumnOpts extends ColumnConfig { } /** * 行配置信息 */ export interface RowConfig { /** * 是否需要为每一行的 VNode 设置 key 属性 */ useKey?: boolean /** * 自定义行数据唯一主键的字段名(默认自动生成) */ keyField?: string /** * 当鼠标点击行时,是否要高亮当前行 */ isCurrent?: boolean /** * 当鼠标移到行时,是否要高亮当前行 */ isHover?: boolean /** * 每一行开启调整行高度 */ resizable?: boolean /** * 只对 show-overflow 有效,每一行的高度 */ height?: number } export interface RowOpts extends RowConfig { } /** * 自定义列配置项 */ export interface CustomConfig { /** * 是否启用 localStorage 本地保存,会将列操作状态保留在本地(需要有 id) */ storage?: boolean | { visible?: boolean resizable?: boolean fixed?: boolean order?: boolean } /** * 自定义列是否允许列选中的方法,该方法的返回值用来决定这一列的 checkbox 是否可以选中 */ checkMethod?(params: { column: VxeTableDefines.ColumnInfo }): boolean } export interface CustomOpts extends CustomConfig { } /** * 列调整配置项 */ export interface ResizableConfig { /** * 列宽拖动的最小宽度 */ minWidth?: number | string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number $rowIndex: number cell: HTMLElement }) => number | string) /** * 列宽拖动的最大宽度 */ maxWidth?: number | string | ((params: { $table: VxeTableConstructor & VxeTablePrivateMethods column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number $rowIndex: number cell: HTMLElement }) => number | string) } export interface ResizableOpts extends ResizableConfig { } /** * 序号配置项 */ export interface SeqConfig { startIndex?: number seqMethod?(params: { column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number row: D rowIndex: number $rowIndex: number }): number | string } export interface SeqOpts extends SeqConfig { } interface SortConfigDefaultSort { field: string order: SortOrder } /** * 排序配置项 */ export interface SortConfig { defaultSort?: SortConfigDefaultSort | SortConfigDefaultSort[] orders?: SortOrder[] sortMethod?(params: { $table: VxeTableConstructor & VxeTablePrivateMethods data: D[] sortList: VxeTableDefines.SortCheckedParams[] }): any[] remote?: boolean multiple?: boolean chronological?: boolean trigger?: 'default' | 'cell' showIcon?: boolean iconLayout?: 'horizontal' | 'vertical' iconAsc?: string iconDesc?: string } export type SortOrder = 'asc' | 'desc' | '' | null export interface SortOpts extends SortConfig { orders: SortOrder[] } /** * 筛选配置项 */ export interface FilterConfig { filterMethod?:(params: { options: VxeTableDefines.FilterOption[] values: any[] cellValue: any row: D column: VxeTableDefines.ColumnInfo }) => any remote?: boolean showIcon?: boolean iconNone?: string iconMatch?: string confirmButtonText?: string resetButtonText?: string } export interface FilterOpts extends FilterConfig { } /** * 单选框配置 */ export interface RadioConfig { reserve?: boolean labelField?: string checkRowKey?: string | number checkMethod?(params: { row: D }): boolean visibleMethod?(params: { row: D }): boolean trigger?: 'default' | 'cell' | 'row' | '' | null highlight?: boolean strict?: boolean } export interface RadioOpts extends RadioConfig { } /** * 复选框配置项 */ export interface CheckboxConfig { reserve?: boolean labelField?: string checkField?: string indeterminateField?: string showHeader?: boolean checkAll?: boolean checkRowKeys?: string[] | number[] checkStrictly?: boolean strict?: boolean isShiftKey?: boolean checkMethod?(params: { row: D }): boolean visibleMethod?(params: { row: D }): boolean trigger?: 'default' | 'cell' | 'row' | '' | null highlight?: boolean range?: boolean /** * 请使用 indeterminateField * @deprecated */ halfField?: string } export interface CheckboxOpts extends CheckboxConfig { } /** * 提示信息配置项 */ export interface TooltipConfig { showAll?: boolean theme?: 'dark' | 'light' | '' | null enterable?: boolean enterDelay?: number leaveDelay?: number contentMethod?(params: { items: any[] row: D rowIndex: number $rowIndex: number _rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number type: 'header' | 'body' | 'footer' | '' | null cell: HTMLElement $event: any }): string | null | void } export interface TooltipOpts extends TooltipConfig { } /** * 展开行配置项 */ export interface ExpandConfig { labelField?: string expandAll?: boolean expandRowKeys?: string[] | number[] accordion?: boolean trigger?: 'default' | 'cell' | 'row' | '' | null lazy?: boolean reserve?: boolean height?: number loadMethod?(params: { $table: VxeTableConstructor & VxeTablePrivateMethods row: D rowIndex: number $rowIndex: number }): Promise toggleMethod?(params: { $table: VxeTableConstructor & VxeTablePrivateMethods expanded: boolean row: D rowIndex: number $rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number }): boolean visibleMethod?(params: VxeTableDefines.CellRenderBodyParams): boolean showIcon?: boolean iconOpen?: string iconClose?: string iconLoaded?: string } export interface ExpandOpts extends ExpandConfig { } /** * 树形结构配置项 */ export interface TreeConfig { /** * 自动将列表转为树结构 */ transform?: boolean /** * 用于 tree-config.transform,树节点的字段名 */ rowField?: string /** * 用于 tree-config.transform,树父节点的字段名 */ parentField?: string /** * 树子节点的字段名 */ childrenField?: string /** * 用于 tree-config.transform,树子节点映射的字段名 */ mapChildrenField?: string /** * 树节点的缩进 */ indent?: number /** * 树节点的连接线(启用连接线会降低渲染性能) */ showLine?: boolean /** * 默认展开所有子孙树节点(只会在初始化时被触发一次) */ expandAll?: boolean /** * 默认展开指定树节点(只会在初始化时被触发一次,需要有 row-config.keyField) */ expandRowKeys?: string[] | number[] /** * 对于同一级的节点,每次只能展开一个 */ accordion?: boolean /** * 触发方式(注:当多种功能重叠时,会同时触发) */ trigger?: 'default' | 'cell' | 'row' | '' | null /** * 是否使用懒加载(启用后只有指定 hasChildField 字段的节点才允许被点击) */ lazy?: boolean /** * 只对 lazy 启用后有效,标识是否存在子节点,从而控制是否允许被点击 */ hasChildField?: string /** * 是否保留展开状态,对于某些场景可能会用到,比如数据被刷新之后还保留之前展开的状态(需要有 row-config.keyField) */ reserve?: boolean /** * 该方法用于异步加载子节点 */ loadMethod?(params: { $table: VxeTableConstructor & VxeTablePrivateMethods row: D }): Promise /** * 该方法在展开或关闭触发之前调用,可以通过返回值来决定是否允许继续执行 */ toggleMethod?(params: { $table: VxeTableConstructor & VxeTablePrivateMethods expanded: boolean row: D column: VxeTableDefines.ColumnInfo columnIndex: number $columnIndex: number }): boolean /** * 是否显示图标按钮 */ showIcon?: boolean /** * 自定义展开后显示的图标 */ iconOpen?: string /** * 自定义收起后显示的图标 */ iconClose?: string /** * 自定义懒加载中显示的图标 */ iconLoaded?: string /** * 已废弃,请使用 showLine * @deprecated */ line?: boolean /** * 已废弃,请使用 hasChildField * @deprecated */ hasChild?: string /** * 已废弃,请使用 childrenField * @deprecated */ children?: string } export type TreeOpts = Required> /** * 快捷菜单配置项 */ export interface MenuConfig { /** * 是否启用 */ enabled?: boolean /** * 表头的右键菜单 */ header?: VxeTableDefines.MenuOptions /** * 内容的右键菜单 */ body?: VxeTableDefines.MenuOptions /** * 表尾的右键菜单 */ footer?: VxeTableDefines.MenuOptions /** * 触发方式 * default(默认右键表格触发), cell(右键单元格触发) */ trigger?: 'default' | 'cell' | '' | null /** * 菜单面板的 className */ className?: string /** * 该函数的返回值用来决定是否允许显示右键菜单(对于需要对菜单进行权限控制时可能会用到) */ visibleMethod?(params: { type: string options: VxeTableDefines.MenuFirstOption[][] columns: VxeTableDefines.ColumnInfo[] row?: D rowIndex?: number column?: VxeTableDefines.ColumnInfo columnIndex?: number }): boolean } export type MenuOpts = Required> /** * 鼠标配置项 */ export interface MouseConfig { /** * 开启单元格选中功能(只对 edit-config.mode=cell 有效) */ selected?: boolean /** * 如果功能被支持,则开启单元格区域选取功能,非连续的区域,按住 Ctrl 键,用鼠标逐一选取 */ area?: boolean /** * 只对 area 启用后有效,是否开启区域扩展选取功能,开启后可以通过鼠标左键按住区域内右下角扩展按钮,将区域横向或纵向扩大(支持扩大区域并复制值) */ extension?: boolean } export interface MouseOpts extends MouseConfig { } /** * 区域配置项 */ export interface AreaConfig { /** * 只对 mouse-config.area 启用后有效,启用多区域选取功能 */ multiple?: boolean /** * 只对 mouse-config.area 启用后有效,点击列头是否选取当前列的所有单元格 */ selectCellByHeader?: boolean /** * 只对 mouse-config.extension 启用后有效,将被选取区域的值复制到扩展区域中 */ extendByCopy?: boolean /** * 只对 mouse-config.extension 启用后有效,扩展区域时将自动识别数字规则进行计算 */ extendByCalc?: boolean /** * 只对 extendByCalc 启用后有效,重写单元格扩展区域计算值的方法 * @param params */ extendCalcMethod?(params: VxeTableProDefines.ExtendCellAreaCalcBaseParams): any[][] /** * 只对 extendByCopy | extendByCalc 启用后有效,重写单元格扩展区域赋值的方法 * @param params */ extendSetMethod?(params: { cellValue: any row: D column: VxeTableDefines.ColumnInfo } & VxeTableProDefines.ExtendCellAreaCalcBaseParams): void /** * 只对 extendByCopy | extendByCalc 启用后有效,自定义单元格扩展区域赋值之前的方法,可以通过返回 false 阻止扩展行为 * @param params */ beforeExtendSetMethod?(params: VxeTableProDefines.ExtendCellAreaCalcBaseParams): boolean /** * 只对 extendByCopy | extendByCalc 启用后有效,自定义单元格扩展区域赋值之后的方法 * @param params */ afterExtendSetMethod?(params: { extendValues: any[][] } & VxeTableProDefines.ExtendCellAreaCalcBaseParams): boolean } export interface AreaOpts extends AreaConfig { } /** * 按键配置项 */ export interface KeyboardConfig { /** * 是否开启非编辑状态下,上下左右移动功能 */ isArrow?: boolean /** * 是否开启Esc键退出编辑功能 */ isEsc?: boolean /** * 是否开启删除键功能 */ isDel?: boolean /** * 是否开启回车移动上下行移动 */ isEnter?: boolean /** * 如果功能被支持,用于 mouse-config.area,开启同时按住方向键以活动区域为起始,向指定方向延伸单元格区域 */ isShift?: boolean /** * 是否开启TAB键左右移动功能 */ isTab?: boolean /** * 是否开启单元格选择编辑 */ isEdit?: boolean /** * 用于 mouse-config.area,开启合并和取消合并功能 */ isMerge?: boolean /** * 用于 mouse-config.area,开启复制/剪贴/粘贴功能 */ isClip?: boolean /** * 如果功能被支持,用于 mouse-config.area,开启查找和替换功能 */ isFNR?: boolean /** * 用于 mouse-config.area & column.type=checkbox|radio,开启空格键切换复选框或单选框状态功能 */ isChecked?: boolean /** * 用于 mouse-config.area,是否将回车键行为改成 Tab 键行为 */ enterToTab?: boolean /** * 只对 isDel=true 有效,用于删除键清空单元格内容方法 */ delMethod?(params: { row: D rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $table: VxeTableConstructor & VxeTablePrivateMethods }): void /** * 只对 isDel=true 有效,用于重写回退键清空单元格内容并激活为编辑状态方法 */ backMethod?(params: { row: D rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $table: VxeTableConstructor & VxeTablePrivateMethods }): void /** * 只对 isEdit=true 有效,用于重写编辑单元格方法 */ editMethod?(params: { row: D rowIndex: number column: VxeTableDefines.ColumnInfo columnIndex: number $table: VxeTableConstructor & VxeTablePrivateMethods $grid: VxeGridConstructor | null | undefined }): boolean } export interface KeyboardOpts extends KeyboardConfig { } /** * 复制/粘贴配置项 */ export interface ClipConfig
{ /** * 是否启用复制功能 */ isCopy?: boolean /** * 是否启用剪贴功能 */ isCut?: boolean /** * 是否启用粘贴功能 */ isPaste?: boolean /** * 是否填充粘贴,如果启用了,当被选取的粘贴单元格与粘贴单元格的行与列数量不匹配时,会将内容强制粘贴所选的单元格 */ isFillPaste?: boolean /** * 是否启用行自增,当粘贴的行数超出表格时自动插入新行 */ isRowIncrement?: boolean /** * 是否启用列自增,当粘贴的列数超出表格时自动插入新列(需要注意自增的列自字段是否定义,否则将无法响应) */ isColumnIncrement?: boolean /** * 重写单元格复制取值的方法,将单元格复制到剪贴板 */ copyMethod?(params: { isCut: boolean row: DT column: VxeTableDefines.ColumnInfo
cellValue: any $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): string /** * 自定义单元格复制取值之前的方法,可以通过返回 false 阻止复制行为 */ beforeCopyMethod?(params: { isCut: boolean activeArea: VxeTableProDefines.MouseActiveCellArea targetAreas: VxeTableProDefines.CellAreaParams
[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean /** * 自定义单元格复制到剪贴板之后的方法 */ afterCopyMethod?(params: { isCut: boolean targetAreas: VxeTableProDefines.CellAreaParams
[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean /** * 重写单元格剪贴值清除的方法,将剪贴单元格的值清除 */ cutMethod?:(params: { row: DT, column: VxeTableDefines.ColumnInfo
cellValue: any $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }) => void /** * 自定义单元格剪贴值清除之前的方法,可以通过返回 false 阻止清除行为 */ beforeCutMethod?:(params: { activeArea: VxeTableProDefines.MouseActiveCellArea cutAreas: VxeTableProDefines.CellAreaParams
[] currentAreas: VxeTableProDefines.CellAreaParams
[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }) => boolean /** * 自定义单元格剪贴值清除之后的方法 */ afterCutMethod?:(params: { cutAreas: VxeTableProDefines.CellAreaParams
[] currentAreas: VxeTableProDefines.CellAreaParams
[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }) => void /** * 重写单元格粘贴赋值的方法,从剪贴板赋值到单元格 */ pasteMethod?(params: { isCut: boolean row: DT, column: VxeTableDefines.ColumnInfo
cellValue: any $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): void /** * 自定义单元格粘贴赋值之前的方法,可以通过返回 false 阻止复制行为 */ beforePasteMethod?(params: { isCut: boolean activeArea: VxeTableProDefines.MouseActiveCellArea cutAreas: VxeTableProDefines.CellAreaParams
[] currentAreas: VxeTableProDefines.CellAreaParams
[] targetAreas: VxeTableProDefines.CellAreaParams
[] cellValues: string[][] pasteCells: string[][] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean /** * 自定义单元格粘贴赋值之后的方法 */ afterPasteMethod?(params: { isCut: boolean currentAreas: VxeTableProDefines.CellAreaParams
[] cutAreas: VxeTableProDefines.CellAreaParams
[] targetAreas: VxeTableProDefines.CellAreaParams
[] cellValues: any[][] pasteCells: string[][] insertRows: DT[] insertColumns: VxeTableDefines.ColumnInfo
[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean /** * 只对 isRowIncrement 有效,自定义创建自增行数据的方法 */ createRowsMethod?(params: { currentAreas: VxeTableProDefines.CellAreaParams
[] targetAreas: VxeTableProDefines.CellAreaParams
[] cellValues: any[][] pasteCells: string[][] insertRows: DT[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): DT[] /** * 只对 isColumnIncrement 有效,自定义创建自增列配置的方法 */ createColumnsMethod?(params: { currentAreas: VxeTableProDefines.CellAreaParams
[] targetAreas: VxeTableProDefines.CellAreaParams
[] cellValues: any[][] pasteCells: string[][] insertColumns: VxeTableDefines.ColumnOptions[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): VxeTableDefines.ColumnOptions
[] } export interface ClipOpts extends ClipConfig { } /** * 查找/替换配置项 */ export interface FNRConfig
{ /** * 是否启用查找功能 */ isFind?: boolean /** * 自定义单元格查找方法 */ findMethod?(params: { cellValue: any isWhole: boolean isRE: boolean isSensitive: boolean findValue: string | null findRE: RegExp | null }): boolean /** * 自定义单元格查找之前的方法,可以通过返回 false 阻止查找行为 */ beforeFindMethod?(params: { isAll: boolean findValue: string | null $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean /** * 自定义单元格查找之后的方法 */ afterFindMethod?(params: { isAll: boolean findValue: string | null result: VxeTableProDefines.FindAndReplaceResult[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): void /** * 是否启用替换功能 */ isReplace?: boolean /** * 自定义单元格替换方法 */ replaceMethod?:(params: { row: DT column: VxeTableDefines.ColumnInfo
cellValue: any }) => void /** * 自定义单元格替换之前的方法,可以通过返回 false 阻止替换行为 */ beforeReplaceMethod?:(params: { isAll: boolean findValue: string | null replaceValue: string $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }) => boolean /** * 自定义单元格替换之后的方法 */ afterReplaceMethod?:(params: { isAll: boolean findValue: string | null replaceValue: string result: VxeTableProDefines.FindAndReplaceResult[] $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }) => void } export interface FNROpts extends FNRConfig { } /** * 编辑配置项 */ export interface EditConfig
{ /** * 触发方式 * - manual(手动触发方式,只能用于 mode=row) * - click(点击触发编辑) * - dblclick(双击触发编辑) */ trigger?: 'manual' | 'click' | 'dblclick' | '' | null /** * 是否启用 */ enabled?: boolean /** * 编辑模式 * - cell(单元格编辑模式) * - row(行编辑模式) */ mode?: 'cell' | 'row' | '' | null /** * 自定义可编辑列的状态图标 */ icon?: string /** * 是否显示列头编辑图标 */ showIcon?: boolean /** * 只对 keep-source 开启有效,是否显示单元格新增与修改状态 */ showStatus?: boolean /** * 只对 keep-source 开启有效,是否显示单元格修改状态 */ showUpdateStatus?: boolean /** * 只对 keep-source 开启有效,是否显示单元格新增状态 */ showInsertStatus?: boolean /** * 是否显示必填字段的红色星号 */ showAsterisk?: boolean /** * 当点击表格之外或者非编辑列之后,是否自动清除单元格的激活状态 */ autoClear?: boolean /** * 该方法的返回值用来决定该单元格是否允许编辑 */ beforeEditMethod?(params: { row: DT rowIndex: number column: VxeTableDefines.ColumnInfo
columnIndex: number $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean /** * 请使用 beforeEditMethod * @deprecated */ activeMethod?(params: { row: DT rowIndex: number column: VxeTableDefines.ColumnInfo
columnIndex: number $table: VxeTableConstructor
& VxeTablePrivateMethods
$grid: VxeGridConstructor
| null | undefined }): boolean } export interface EditOpts extends EditConfig { } /** * 校验配置项 */ export interface ValidConfig { /** * 是否自动定位到校验不通过的单元格 */ autoPos?: boolean /** * 是否显示错误显示 */ showMessage?: boolean /** * 校验消息提示方式 * - single 单个提示 * - full - 全量提示 */ msgMode?: 'single' | 'full' | null | '' /** * 当点击表格之外或者其他列之后,是否自动清除单元格的校验消息 */ autoClear?: boolean /** * 校验提示框的最大宽度 */ maxWidth?: number /** * 给校验提示框附加 class */ className?: string | ((params: VxeColumnSlotTypes.ValidSlotParams) => string) /** * 不建议使用,已废弃 * @deprecated */ message?: 'inline' | 'default' | 'tooltip' | '' | null } export interface ValidOpts extends ValidConfig { } /** * 校验规则配置项 */ export interface EditRules { [field: string]: VxeTableDefines.ValidatorRule[] } export type ZIndex = number export type EmptyText = string export interface LoadingConfig { /** * 显示图标 */ icon?: string /** * 显示文字 */ text?: string } export interface LoadingOpts extends LoadingConfig { } export interface EmptyRender extends VxeGlobalRendererHandles.RenderOptions { } export interface EmptyOpts extends EmptyRender { } export type Fit = boolean export type Animat = boolean export type DelayHover = number export interface ScrollX { /** * 指定大于指定列时自动启动横向虚拟滚动,如果为 0 则总是启用;如果需要关闭,可以设置 enabled 为 false */ gt?: number /** * 指定每次渲染的数据偏移量,偏移量越大渲染次数就越少,但每次渲染耗时就越久(对于低性能浏览器可以设置大一点,减低渲染次数) */ oSize?: number /** * 是否启用 */ enabled?: boolean /** * 当数据源被更改时,自动将横向滚动条滚动到左侧 */ scrollToLeftOnChange?: boolean } export interface SXOpts extends ScrollX { gt: number oSize: number } export interface ScrollY { /** * 滚动模式 */ mode?: 'default' | 'wheel' /** * 指定大于指定行时自动启动纵向虚拟滚动,如果为 0 则总是启用;如果需要关闭,可以设置 enabled 为 false(注:启用纵向虚拟滚动之后将不能支持动态行高) */ gt?: number /** * 指定每次渲染的数据偏移量,偏移量越大渲染次数就越少,但每次渲染耗时就越久(对于低性能浏览器可以设置大一点,减低渲染次数) */ oSize?: number /** * 是否启用 */ enabled?: boolean /** * 当数据源被更改时,自动将纵向滚动条滚动到顶部 */ scrollToTopOnChange?: boolean /** * 请使用 row-config.height * @deprecated */ rHeight?: number /** * 不建议使用 * @deprecated */ adaptive?: boolean } export interface SYOpts extends ScrollY { gt: number oSize: number } export type Params = any } export type VxeTableProps = { size?: VxeTablePropTypes.Size /** * 唯一标识 * 当使用某个特定功能时,需要设置才能生效 */ id?: VxeTablePropTypes.ID /** * 表格数据 * 与 loadData 行为一致,更新数据是不会重置状态 */ data?: VxeTablePropTypes.Data /** * 表格的高度;支持铺满父容器或者固定高度,如果设置 auto 为铺满父容器(如果设置为 auto,则必须确保存在父节点且不允许存在相邻元素) */ height?: VxeTablePropTypes.Height /** * 表格最小高度 */ minHeight?: VxeTablePropTypes.MinHeight /** * max-height */ maxHeight?: VxeTablePropTypes.MaxHeight /** * 是否带有斑马纹(需要注意的是,在可编辑表格场景下,临时插入的数据不会有斑马纹样式) */ stripe?: VxeTablePropTypes.Stripe /** * 是否为圆角边框 */ round?: VxeTablePropTypes.Round /** * 是否带有边框 */ border?: VxeTablePropTypes.Border /** * 表格是否显示加载中 */ loading?: VxeTablePropTypes.Loading /** * 所有的列对齐方式 */ align?: VxeTablePropTypes.Align /** * 所有的表头列的对齐方式 */ headerAlign?: VxeTablePropTypes.HeaderAlign /** * 所有的表尾列的对齐方式 */ footerAlign?: VxeTablePropTypes.FooterAlign /** * 是否显示表头 */ showHeader?: VxeTablePropTypes.ShowHeader /** * 是否显示表尾 */ showFooter?: VxeTablePropTypes.ShowFooter /** * 表尾的数据获取方法,返回一个二维数组 */ footerMethod?: VxeTablePropTypes.FooterMethod /** * 给行附加 className */ rowClassName?: VxeTablePropTypes.RowClassName /** * 给单元格附加 className */ cellClassName?: VxeTablePropTypes.CellClassName /** * 给表头的行附加 className */ headerRowClassName?: VxeTablePropTypes.HeaderRowClassName /** * 给表头的单元格附加 className */ headerCellClassName?: VxeTablePropTypes.HeaderCellClassName /** * 给表尾的行附加 className */ footerRowClassName?: VxeTablePropTypes.FooterRowClassName /** * 给表尾的单元格附加 className */ footerCellClassName?: VxeTablePropTypes.FooterCellClassName /** * 给单元格附加样式 */ cellStyle?: VxeTablePropTypes.CellStyle /** * 给行附加样式,也可以是函数 */ rowStyle?: VxeTablePropTypes.RowStyle /** * 给表头单元格附加样式 */ headerCellStyle?: VxeTablePropTypes.HeaderCellStyle /** * 给表头行附加样式 */ headerRowStyle?: VxeTablePropTypes.HeaderRowStyle /** * 给表尾行附加样式 */ footerRowStyle?: VxeTablePropTypes.FooterRowStyle /** * 给表尾单元格附加样式 */ footerCellStyle?: VxeTablePropTypes.FooterCellStyle /** * 临时合并指定的单元格 (不能用于展开行,不建议用于固定列、树形结构) */ mergeCells?: VxeTablePropTypes.MergeCells /** * 临时合并表尾 (不能用于展开行,不建议用于固定列、树形结构) */ mergeFooterItems?: VxeTablePropTypes.MergeFooterItems /** * 自定义合并函数,返回计算后的值 (不能用于虚拟滚动、展开行,不建议用于固定列、树形结构) */ spanMethod?: VxeTablePropTypes.SpanMethod /** * 表尾合并行或列,返回计算后的值 (不能用于虚拟滚动、展开行,不建议用于固定列、树形结构) */ footerSpanMethod?: VxeTablePropTypes.FooterSpanMethod /** * 设置所有内容过长时显示为省略号(如果是固定列建议设置该值,提升渲染速度) */ showOverflow?: VxeTablePropTypes.ShowOverflow /** * 设置表头所有内容过长时显示为省略号 */ showHeaderOverflow?: VxeTablePropTypes.ShowHeaderOverflow /** * 设置表尾所有内容过长时显示为省略号 */ showFooterOverflow?: VxeTablePropTypes.ShowFooterOverflow /** * 保持原始值的状态,被某些功能所依赖,比如编辑状态、还原数据等 */ keepSource?: VxeTablePropTypes.KeepSource /** * 自动监听父元素的变化去重新计算表格(对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到) */ autoResize?: VxeTablePropTypes.AutoResize /** * 自动跟随某个属性的变化去重新计算表格,和手动调用 recalculate 方法是一样的效果(对于通过某个属性来控制显示/隐藏切换时可能会用到) */ syncResize?: VxeTablePropTypes.SyncResize /** * 列配置信息 */ columnConfig?: VxeTablePropTypes.ColumnConfig /** * 行配置信息 */ rowConfig?: VxeTablePropTypes.RowConfig /** * 个性化信息配置项 */ customConfig?: VxeTablePropTypes.CustomConfig /** * 响应式布局配置项 */ resizeConfig?: VxeTablePropTypes.ResizeConfig /** * 列宽拖动配置项 */ resizableConfig?: VxeTablePropTypes.ResizableConfig /** * 序号配置项 */ seqConfig?: VxeTablePropTypes.SeqConfig /** * 排序配置项 */ sortConfig?: VxeTablePropTypes.SortConfig /** * 筛选配置项 */ filterConfig?: VxeTablePropTypes.FilterConfig /** * 单选框配置项 */ radioConfig?: VxeTablePropTypes.RadioConfig /** * 复选框配置项 */ checkboxConfig?: VxeTablePropTypes.CheckboxConfig /** * 工具提示配置项 */ tooltipConfig?: VxeTablePropTypes.TooltipConfig /** * 导出配置项 */ exportConfig?: VxeTablePropTypes.ExportConfig /** * 导入配置项 */ importConfig?: VxeTablePropTypes.ImportConfig /** * 打印配置项 */ printConfig?: VxeTablePropTypes.PrintConfig /** * 展开行配置项 */ expandConfig?: VxeTablePropTypes.ExpandConfig /** * 树形结构配置项 */ treeConfig?: VxeTablePropTypes.TreeConfig /** * 右键菜单配置项 */ menuConfig?: VxeTablePropTypes.MenuConfig /** * 鼠标配置项 */ mouseConfig?: VxeTablePropTypes.MouseConfig /** * 区域选取配置项 */ areaConfig?: VxeTablePropTypes.AreaConfig /** * 查找/替换配置项 */ fnrConfig?: VxeTablePropTypes.FNRConfig /** * 按键配置项 */ keyboardConfig?: VxeTablePropTypes.KeyboardConfig /** * 复制/粘贴配置项 */ clipConfig?: VxeTablePropTypes.ClipConfig /** * 可编辑配置项 */ editConfig?: VxeTablePropTypes.EditConfig /** * 校验配置项 */ validConfig?: VxeTablePropTypes.ValidConfig /** * 校验规则配置项 */ editRules?: VxeTablePropTypes.EditRules /** * 空数据时显示的内容 */ emptyText?: VxeTablePropTypes.EmptyText /** * 空内容渲染配置项,empty-render 的优先级大于 empty-text */ emptyRender?: VxeTablePropTypes.EmptyRender /** * 加载中配置项 */ loadingConfig?: VxeTablePropTypes.LoadingConfig /** * 横向虚拟滚动配置 */ scrollX?: VxeTablePropTypes.ScrollX /** * 纵向虚拟滚动配置 */ scrollY?: VxeTablePropTypes.ScrollY /** * 自定义参数(可以用来存放一些自定义的数据) */ params?: VxeTablePropTypes.Params /** * 已废弃,不建议使用,被 column-config.resizable 替换 * @deprecated */ resizable?: VxeTablePropTypes.Resizable /** * 已废弃,不建议使用,被 row-config.isCurrent 替换 * @deprecated */ highlightCurrentRow?: VxeTablePropTypes.HighlightCurrentRow /** * 已废弃,不建议使用,被 row-config.isHover 替换 * @deprecated */ highlightHoverRow?: VxeTablePropTypes.HighlightHoverRow /** * 已废弃,不建议使用,被 column-config.isCurrent 替换 * @deprecated */ highlightCurrentColumn?: VxeTablePropTypes.HighlightCurrentColumn /** * 已废弃,不建议使用,被 column-config.isHover 替换 * @deprecated */ highlightHoverColumn?: VxeTablePropTypes.HighlightHoverColumn /** * 已废弃 * @deprecated */ highlightCell?: VxeTablePropTypes.HighlightCell /** * 已废弃,请使用 column-config.useKey * @deprecated */ columnKey?: VxeTablePropTypes.ColumnKey /** * 已废弃,请使用 row-config.useKey * @deprecated */ rowKey?: VxeTablePropTypes.RowKey /** * 已废弃,请使用 row-config.keyField * @deprecated */ rowId?: VxeTablePropTypes.RowId /** * 已废弃,已废弃 * @deprecated */ fit?: VxeTablePropTypes.Fit /** * 已废弃,已废弃 * @deprecated */ animat?: VxeTablePropTypes.Animat /** * 已废弃,已废弃 * @deprecated */ delayHover?: VxeTablePropTypes.DelayHover } export type VxeTableEmits = [ 'update:data', 'keydown-start', 'keydown', 'keydown-end', 'paste', 'copy', 'cut', 'current-change', 'radio-change', 'checkbox-change', 'checkbox-all', 'checkbox-range-start', 'checkbox-range-change', 'checkbox-range-end', 'checkbox-range-select', 'cell-click', 'cell-dblclick', 'cell-menu', 'cell-mouseenter', 'cell-mouseleave', 'cell-selected', 'header-cell-click', 'header-cell-dblclick', 'header-cell-menu', 'footer-cell-click', 'footer-cell-dblclick', 'footer-cell-menu', 'clear-merge', 'sort-change', 'clear-sort', 'filter-change', 'filter-visible', 'clear-filter', 'resizable-change', 'toggle-row-expand', 'toggle-tree-expand', 'menu-click', 'edit-closed', 'edit-actived', // 已废弃 'edit-activated', 'edit-disabled', 'valid-error', 'scroll', 'custom', ...VxeTableProEmits ] export namespace VxeTableDefines { export interface SortConfs { field: string order?: VxeTablePropTypes.SortOrder } export interface MergeOptions { row: any | number col: VxeTableDefines.ColumnInfo | number rowspan: number colspan: number } export interface MergeInfo { row: number col: number rowspan: number colspan: number } export interface MergeItem extends MergeInfo { _row: any _col: VxeTableDefines.ColumnInfo _rowspan: number _colspan: number } export interface ColumnOptions extends VxeColumnProps { children?: ColumnOptions[] slots?: VxeColumnPropTypes.Slots } /** * 列对象 */ export class ColumnInfo { /** * 该属性已废弃,该属性被 field 替换 * @deprecated */ property: VxeColumnPropTypes.Field /** * 公开属性 */ type: VxeColumnPropTypes.Type field: VxeColumnPropTypes.Field title: VxeColumnPropTypes.Title width: VxeColumnPropTypes.Width minWidth: VxeColumnPropTypes.MinWidth maxWidth: VxeColumnPropTypes.MaxWidth resizable: VxeColumnPropTypes.Resizable fixed: VxeColumnPropTypes.Fixed align: VxeColumnPropTypes.Align headerAlign: VxeColumnPropTypes.HeaderAlign footerAlign: VxeColumnPropTypes.FooterAlign showOverflow: VxeColumnPropTypes.ShowOverflow showHeaderOverflow: VxeColumnPropTypes.ShowHeaderOverflow showFooterOverflow: VxeColumnPropTypes.ShowFooterOverflow className: VxeColumnPropTypes.ClassName headerClassName: VxeColumnPropTypes.HeaderClassName footerClassName: VxeColumnPropTypes.FooterClassName formatter: VxeColumnPropTypes.Formatter sortable: VxeColumnPropTypes.Sortable sortBy: VxeColumnPropTypes.SortBy sortType: VxeColumnPropTypes.SortType filters: VxeColumnPropTypes.Filter[] filterMultiple: VxeColumnPropTypes.FilterMultiple filterMethod: VxeColumnPropTypes.FilterMethod filterRender: VxeColumnPropTypes.FilterRender treeNode: VxeColumnPropTypes.TreeNode visible: VxeColumnPropTypes.Visible exportMethod: VxeColumnPropTypes.ExportMethod footerExportMethod: VxeColumnPropTypes.FooterExportMethod /** * 已废弃,请使用 titlePrefix * @deprecated */ titleHelp: VxeColumnPropTypes.TitleHelp titlePrefix: VxeColumnPropTypes.TitlePrefix titleSuffix: VxeColumnPropTypes.TitleSuffix cellType: VxeColumnPropTypes.CellType cellRender: VxeColumnPropTypes.CellRender editRender: VxeColumnPropTypes.EditRender contentRender: VxeColumnPropTypes.ContentRender params: VxeColumnPropTypes.Params slots: VxeColumnPropTypes.Slots /** * 以下内部属性 * 内部属性随时都会调整,不应该被使用 */ id: string parentId: string level: number rowSpan: number colSpan: number halfVisible: boolean defaultVisible: any defaultFixed: any checked: boolean halfChecked: boolean disabled: boolean order: VxeTablePropTypes.SortOrder sortTime: number customOrder: number renderWidth: number renderHeight: number resizeWidth: number model: { update: boolean value: any } children: ColumnInfo[] renderHeader(params: CellRenderHeaderParams): VNode[] renderCell(params: CellRenderCellParams): VNode[] renderData(params: CellRenderDataParams): VNode[] renderFooter(params: CellRenderFooterParams): VNode[] getTitle(): string getKey(): string } export interface CellRenderHeaderParams { $table: VxeTableConstructor & VxeTablePrivateMethods $grid: VxeGridConstructor | null $rowIndex: number column: ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number fixed: VxeColumnPropTypes.Fixed type: string isHidden: boolean hasFilter: boolean checked?: boolean indeterminate?: boolean } export interface CellRenderBodyParams { $table: VxeTableConstructor & VxeTablePrivateMethods $grid: VxeGridConstructor | null seq: string | number rowid: string row: D rowIndex: number $rowIndex: number _rowIndex: number column: ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number fixed: VxeColumnPropTypes.Fixed type: string isHidden: boolean level: number visibleData: D[] data: D[] items: any[] } export interface CellRenderDataParams extends CellRenderBodyParams { } export interface CellRenderCellParams extends CellRenderBodyParams { } export interface CellRenderFooterParams { $table: VxeTableConstructor & VxeTablePrivateMethods $grid: VxeGridConstructor | null _rowIndex: number $rowIndex: number column: ColumnInfo columnIndex: number $columnIndex: number _columnIndex: number itemIndex: number items: any[] fixed: VxeColumnPropTypes.Fixed type: string data: any[][] } interface TableEventParams extends VxeEvent { $table: VxeTableConstructor & VxeTablePrivateMethods } interface TableBaseHeaderCellParams { $rowIndex: number column: ColumnInfo columnIndex: number $columnIndex: number } interface TableBaseCellParams { row: D rowIndex: number $rowIndex: number column: ColumnInfo columnIndex: number $columnIndex: number } interface TableBaseFooterCellParams { $rowIndex: number column: ColumnInfo columnIndex: number $columnIndex: number } export interface KeydownStartParams { } export interface KeydownStartEventParams extends TableEventParams, KeydownStartParams { } export interface KeydownParams { } export interface KeydownEventParams extends TableEventParams, KeydownParams { } export interface KeydownEndParams { } export interface KeydownEndEventParams extends TableEventParams, KeydownEndParams { } export interface PasteParams { } export interface PasteEventParams extends TableEventParams, PasteParams { } export interface CopyParams { } export interface CopyEventParams extends TableEventParams, CopyParams { } export interface CutParams { } export interface CutEventParams extends TableEventParams, CutParams { } export interface CurrentChangeParams extends TableBaseCellParams { newValue: any oldValue: any } export interface CurrentChangeEventParams extends TableEventParams, CurrentChangeParams { } export interface RadioChangeParams extends TableBaseCellParams { newValue: any oldValue: any } export interface RadioChangeEventParams extends TableEventParams, RadioChangeParams { } export interface CheckboxChangeParams extends TableBaseCellParams { checked: boolean /** * 请调用方法 getCheckboxRecords() 获取 * @deprecated */ records: D[] /** * 请调用方法 getCheckboxReserveRecords() 获取 * @deprecated */ reserves: D[] /** * 请调用方法 getCheckboxIndeterminateRecords() 获取 * @deprecated */ indeterminates: D[] } export interface CheckboxChangeEventParams extends TableEventParams, CheckboxChangeParams { } export interface CheckboxAllParams extends CheckboxChangeParams { } export interface CheckboxAllEventParams extends TableEventParams, CheckboxAllParams { } export interface CheckboxRangeStartParams { /** * 请调用方法 getCheckboxRecords() 获取 * @deprecated */ records: D[] /** * 请调用方法 getCheckboxReserveRecords() 获取 * @deprecated */ reserves: D[] } export interface CheckboxRangeStartEventParams extends TableEventParams, CheckboxRangeStartParams { } export interface CheckboxRangeChangeParams extends CheckboxRangeStartParams { } export interface CheckboxRangeChangeEventParams extends TableEventParams, CheckboxRangeChangeParams { } export interface CheckboxRangeEndParams extends CheckboxRangeStartParams { } export interface CheckboxRangeEndEventParams extends TableEventParams, CheckboxRangeEndParams { } export interface CheckboxRangeSelectParams { rangeRecords: D[] } export interface CheckboxRangeSelectEventParams extends TableEventParams, CheckboxRangeSelectParams { } export interface CellClickParams extends TableBaseCellParams { triggerRadio: boolean triggerCheckbox: boolean triggerTreeNode: boolean triggerExpandNode: boolean } export interface CellClickEventParams extends TableEventParams, CellClickParams { } export interface CellDblclickParams extends TableEventParams, CellClickParams { } export interface CellDblclickEventParams extends TableEventParams, CellDblclickParams { } export interface CellMenuParams extends TableBaseCellParams { } export interface CellMenuEventParams extends TableEventParams, CellMenuParams { } export interface CellMouseenterParams extends TableBaseCellParams { } export interface CellMouseenterEventParams extends TableEventParams, CellMouseenterParams { } export interface CellMouseleaveParams extends TableBaseCellParams { } export interface CellMouseleaveEventParams extends TableEventParams, CellMouseleaveParams { } export interface HeaderCellClickParams extends TableBaseHeaderCellParams { triggerResizable: boolean triggerSort: boolean triggerFilter: boolean } export interface HeaderCellClickEventParams extends TableEventParams, HeaderCellClickParams { } export interface HeaderCellDblclickParams extends TableBaseHeaderCellParams { } export interface HeaderCellDblclickEventParams extends TableEventParams, HeaderCellDblclickParams { } export interface HeaderCellMenuParams extends TableBaseHeaderCellParams { } export interface HeaderCellMenuEventParams extends TableEventParams, HeaderCellMenuParams { } export interface FooterCellClickParams extends TableBaseFooterCellParams { } export interface FooterCellClickEventParams extends TableEventParams, FooterCellClickParams { } export interface FooterCellDblclickParams extends TableBaseFooterCellParams { } export interface FooterCellDblclickEventParams extends TableEventParams, FooterCellDblclickParams { } export interface FooterCellMenuParams extends TableBaseFooterCellParams { } export interface FooterCellMenuEventParams extends TableEventParams, FooterCellMenuParams { } export interface SortCheckedParams { column: VxeTableDefines.ColumnInfo field: VxeColumnPropTypes.Field property: VxeColumnPropTypes.Field order: VxeTablePropTypes.SortOrder sortTime: number } export interface SortChangeParams extends SortCheckedParams { sortList: SortCheckedParams[] } export interface SortChangeEventParams extends TableEventParams, SortChangeParams { } export interface FilterCheckedParams { column: VxeTableDefines.ColumnInfo field: VxeColumnPropTypes.Field property: VxeColumnPropTypes.Field values: any[] datas: any[] } export interface FilterChangeParams extends FilterCheckedParams { filterList: FilterCheckedParams[] } export interface FilterChangeEventParams extends TableEventParams, FilterChangeParams { } export interface FilterVisibleParams { column: VxeTableDefines.ColumnInfo field: VxeColumnPropTypes.Field property: VxeColumnPropTypes.Field filterList: FilterCheckedParams[] visible: boolean } export interface FilterVisibleEventParams extends TableEventParams, FilterVisibleParams { } export interface ResizableChangeParams extends TableBaseHeaderCellParams { } export interface ResizableChangeEventParams extends TableEventParams, ResizableChangeParams { resizeWidth: number } export interface ToggleRowExpandParams extends TableBaseCellParams { } export interface ToggleRowExpandEventParams extends TableEventParams, ToggleRowExpandParams { } export interface ToggleTreeExpandParams extends TableBaseCellParams { } export interface ToggleTreeExpandEventParams extends TableEventParams, ToggleTreeExpandParams { } export interface MenuClickParams extends TableBaseCellParams { menu: VxeTableDefines.MenuFirstOption | VxeTableDefines.MenuChildOption type: string } export interface MenuClickEventParams extends TableEventParams, MenuClickParams { } export interface EditClosedParams extends TableBaseCellParams { } export interface EditClosedEventParams extends TableEventParams, EditClosedParams { } export interface EditActivedParams extends TableBaseCellParams { } export interface EditActivedEventParams extends TableEventParams, EditActivedParams { } export interface EditDisabledParams extends TableBaseCellParams { } export interface EditDisabledEventParams extends TableEventParams, EditDisabledParams { } export interface ValidErrorParams extends TableBaseCellParams { rule: any } export interface ValidErrorEventParams extends TableEventParams, ValidErrorParams { } export interface ScrollParams { type: string scrollTop: number scrollLeft: number scrollHeight: number scrollWidth: number bodyWidth: number bodyHeight: number isX: boolean isY: boolean } export interface ScrollEventParams extends TableEventParams, ScrollParams { target: HTMLDivElement } export interface CustomParams { type: string } export interface CustomEventParams extends TableEventParams, CustomParams { } } export interface VxeTableEventProps { onKeydownStart?: VxeTableEvents.KeydownStart onKeydown?: VxeTableEvents.Keydown onKeydownEnd?: VxeTableEvents.KeydownEnd onPaste?: VxeTableEvents.Paste onCopy?: VxeTableEvents.Copy onCut?: VxeTableEvents.Cut onCurrentChange?: VxeTableEvents.CurrentChange onRadioChange?: VxeTableEvents.RadioChange onCheckboxChange?: VxeTableEvents.CheckboxChange onCheckboxAll?: VxeTableEvents.CheckboxAll onCheckboxRangeStart?: VxeTableEvents.CheckboxRangeStart onCheckboxRangeChange?: VxeTableEvents.CheckboxRangeChange onCheckboxRangeEnd?: VxeTableEvents.CheckboxRangeEnd onCheckboxRangeSelect?: VxeTableEvents.CheckboxRangeSelect onCellClick?: VxeTableEvents.CellClick onCellDblclick?: VxeTableEvents.CellDblclick onCellMenu?: VxeTableEvents.CellMenu onCellMouseenter?: VxeTableEvents.CellMouseenter onCellMouseleave?: VxeTableEvents.CellMouseleave onHeaderCellClick?: VxeTableEvents.HeaderCellClick onHeaderCellDblclick?: VxeTableEvents.HeaderCellDblclick onHeaderCellMenu?: VxeTableEvents.HeaderCellMenu onFooterCellClick?: VxeTableEvents.FooterCellClick onFooterCellDblclick?: VxeTableEvents.FooterCellDblclick onFooterCellMenu?: VxeTableEvents.FooterCellMenu onSortChange?: VxeTableEvents.SortChange onFilterChange?: VxeTableEvents.FilterChange onFilterVisible?: VxeTableEvents.FilterVisible onResizableChange?: VxeTableEvents.ResizableChange onToggleRowExpand?: VxeTableEvents.ToggleRowExpand onToggleTreeExpand?: VxeTableEvents.ToggleTreeExpand onMenuClick?: VxeTableEvents.MenuClick onEditClosed?: VxeTableEvents.EditClosed onEditActived?: VxeTableEvents.EditActived onEditDisabled?: VxeTableEvents.EditDisabled onValidError?: VxeTableEvents.ValidError onScroll?: VxeTableEvents.Scroll onCustom?: VxeTableEvents.Custom } export interface VxeTableListeners { /** * 当表格被激活且键盘被按下开始时会触发的事件 */ keydownStart?: VxeTableEvents.KeydownStart /** * 当表格被激活且键盘被按下时会触发的事件 */ keydown?: VxeTableEvents.Keydown /** * 当表格被激活且键盘被按下结束时会触发的事件 */ keydownEnd?: VxeTableEvents.KeydownEnd paste?: VxeTableEvents.Paste copy?: VxeTableEvents.Copy cut?: VxeTableEvents.Cut currentChange?: VxeTableEvents.CurrentChange radioChange?: VxeTableEvents.RadioChange checkboxChange?: VxeTableEvents.CheckboxChange checkboxAll?: VxeTableEvents.CheckboxAll checkboxRangeStart?: VxeTableEvents.CheckboxRangeStart checkboxRangeChange?: VxeTableEvents.CheckboxRangeChange checkboxRangeEnd?: VxeTableEvents.CheckboxRangeEnd checkboxRangeSelect?: VxeTableEvents.CheckboxRangeSelect cellClick?: VxeTableEvents.CellClick cellDblclick?: VxeTableEvents.CellDblclick cellMenu?: VxeTableEvents.CellMenu cellMouseenter?: VxeTableEvents.CellMouseenter cellMouseleave?: VxeTableEvents.CellMouseleave headerCellClick?: VxeTableEvents.HeaderCellClick headerCellDblclick?: VxeTableEvents.HeaderCellDblclick headerCellMenu?: VxeTableEvents.HeaderCellMenu footerCellClick?: VxeTableEvents.FooterCellClick footerCellDblclick?: VxeTableEvents.FooterCellDblclick footerCellMenu?: VxeTableEvents.FooterCellMenu sortChange?: VxeTableEvents.SortChange filterChange?: VxeTableEvents.FilterChange resizableChange?: VxeTableEvents.ResizableChange toggleRowExpand?: VxeTableEvents.ToggleRowExpand toggleTreeExpand?: VxeTableEvents.ToggleTreeExpand menuClick?: VxeTableEvents.MenuClick editClosed?: VxeTableEvents.EditClosed editActived?: VxeTableEvents.EditActived editDisabled?: VxeTableEvents.EditDisabled /** * 只对 edit-rules 配置时有效,当数据校验不通过时会触发该事件 */ validError?: VxeTableEvents.ValidError /** * 表格滚动时会触发该事件 */ scroll?: VxeTableEvents.Scroll /** * 如果与工具栏关联,在自定义列按钮被手动点击后会触发该事件 */ custom?: VxeTableEvents.Custom } export namespace VxeTableEvents { export type KeydownStart = (params: VxeTableDefines.KeydownStartEventParams) => void export type Keydown = (params: VxeTableDefines.KeydownEventParams) => void export type KeydownEnd = (params: VxeTableDefines.KeydownEndEventParams) => void export type Paste = (params: VxeTableDefines.PasteEventParams) => void export type Copy = (params: VxeTableDefines.CopyEventParams) => void export type Cut = (params: VxeTableDefines.CutEventParams) => void export type CurrentChange = (params: VxeTableDefines.CurrentChangeEventParams) => void export type RadioChange = (params: VxeTableDefines.RadioChangeEventParams) => void export type CheckboxChange = (params: VxeTableDefines.CheckboxChangeEventParams) => void export type CheckboxAll = (params: VxeTableDefines.CheckboxAllEventParams) => void export type CheckboxRangeStart = (params: VxeTableDefines.CheckboxRangeStartEventParams) => void export type CheckboxRangeChange = (params: VxeTableDefines.CheckboxRangeChangeEventParams) => void export type CheckboxRangeEnd = (params: VxeTableDefines.CheckboxRangeEndEventParams) => void export type CheckboxRangeSelect = (params: VxeTableDefines.CheckboxRangeSelectEventParams) => void export type CellClick = (params: VxeTableDefines.CellClickEventParams) => void export type CellDblclick = (params: VxeTableDefines.CellDblclickEventParams) => void export type CellMenu = (params: VxeTableDefines.CellMenuEventParams) => void export type CellMouseenter = (params: VxeTableDefines.CellMouseenterEventParams) => void export type CellMouseleave = (params: VxeTableDefines.CellMouseleaveEventParams) => void export type HeaderCellClick = (params: VxeTableDefines.HeaderCellClickEventParams) => void export type HeaderCellDblclick = (params: VxeTableDefines.HeaderCellDblclickEventParams) => void export type HeaderCellMenu = (params: VxeTableDefines.HeaderCellMenuEventParams) => void export type FooterCellClick = (params: VxeTableDefines.FooterCellClickEventParams) => void export type FooterCellDblclick = (params: VxeTableDefines.FooterCellDblclickEventParams) => void export type FooterCellMenu = (params: VxeTableDefines.FooterCellMenuEventParams) => void export type SortChange = (params: VxeTableDefines.SortChangeEventParams) => void export type FilterChange = (params: VxeTableDefines.FilterChangeEventParams) => void export type FilterVisible = (params: VxeTableDefines.FilterVisibleEventParams) => void export type ResizableChange = (params: VxeTableDefines.ResizableChangeEventParams) => void export type ToggleRowExpand = (params: VxeTableDefines.ToggleRowExpandEventParams) => void export type ToggleTreeExpand = (params: VxeTableDefines.ToggleTreeExpandEventParams) => void export type MenuClick = (params: VxeTableDefines.MenuClickEventParams) => void export type EditClosed = (params: VxeTableDefines.EditClosedEventParams) => void export type EditActived = (params: VxeTableDefines.EditActivedEventParams) => void export type EditDisabled = (params: VxeTableDefines.EditDisabledEventParams) => void export type ValidError = (params: VxeTableDefines.ValidErrorEventParams) => void export type Scroll = (params: VxeTableDefines.ScrollEventParams) => void export type Custom = (params: VxeTableDefines.CustomEventParams) => void } export interface VxeTableSlots { /** * 自定义空数据时显示模板 */ empty?(params: { $table: VxeTableConstructor $grid: VxeGridConstructor | null | undefined }): any /** * 自定义加载中模板 */ loading?(params: { $table: VxeTableConstructor $grid: VxeGridConstructor | null | undefined }): any }