Options
All
  • Public
  • Public/Protected
  • All
Menu

Class ElTable

Table 表格 https://element.eleme.cn/#/zh-CN/component/Table

Hierarchy

  • VueDbCmpBase
    • ElTable

Index

Constructors

Properties

Methods

Constructors

constructor

  • new ElTable(config: any): ElTable

  • Parameters

    • config: any

    Returns ElTable

Properties

border

border: boolean

是否带有纵向边框

cellClassName

cellClassName: string

单元格的类名的回调方法，也可以使用字符串为所有单元格设置一个固定的 className。

cellClick

cellClick: string

当某个单元格被点击时会触发该事件

cellDblclick

cellDblclick: string

当某个单元格被双击击时会触发该事件

cellMouseEnter

cellMouseEnter: string

当单元格 hover 进入时会触发该事件

cellMouseLeave

cellMouseLeave: string

当单元格 hover 退出时会触发该事件

cellStyle

cellStyle: string

单元格的样式的回调方法，也可以使用一个固定的 Object 为所有单元格设置一样的 Style。

css

css: ElTableStyle

currentChange

currentChange: string

当表格的当前行发生变化的时候会触发该事件，如果要高亮当前行，请打开表格的 highlight-current-row 属性

currentRowKey

currentRowKey: string

当前行的 key，只写属性

data

data: any[]

数据

defaultExpandAll

defaultExpandAll: boolean

是否树形默认展开所有行，当 Table 包含展开行存在或者为树形表格时有效

defaultSort

defaultSort: string

默认的排序列的 prop 和顺序。它的prop属性指定默认的排序的列，order指定默认排序的顺序

emptyText

emptyText: string

空数据时显示的文本内容，也可以通过 slot="empty" 设置

expandChange

expandChange: string

当用户对某一行展开或者关闭的时候会触发该事件（展开行时，回调的第二个参数为 expandedRows；树形表格时第二参数为 expanded）

expandRowKeys

expandRowKeys: string

可以通过该属性设置 Table 目前的展开行，需要设置 row-key 属性才能使用，该属性为展开行的 keys 数组

filterChange

filterChange: string

当表格的筛选条件发生变化的时候会触发该事件，参数的值是一个对象，对象的 key 是 column 的 columnKey，对应的 value 为用户选择的筛选条件的数组。

fit

fit: boolean

列的宽度是否自撑开

headerCellClassName

headerCellClassName: string

表头单元格的类名的回调方法，也可以使用字符串为所有表头单元格设置一个固定的 className

headerCellStyle

headerCellStyle: string

表头单元格的样式的回调方法，也可以使用一个固定的 Object 为所有表头单元格设置一样的 Style。

headerClick

headerClick: string

当某一列的表头被点击时会触发该事件

headerContextmenu

headerContextmenu: string

当某一列的表头被鼠标右键点击事件

headerDragend

headerDragend: string

当拖动表头改变了列的宽度的时候会触发该事件

headerRowClassName

headerRowClassName: string

表头行的类名的回调方法，也可以使用字符串为所有表头行设置一个固定的 className。

headerRowStyle

headerRowStyle: string

表头行的样式的回调方法，也可以使用一个固定的 Object 为所有表头行设置一样的 Style。

highlightCurrentRow

highlightCurrentRow: boolean

是否要高亮当前行

indent

indent: Number

展示树形数据时，树节点的缩进

lazy

lazy: boolean

是否懒加载子节点数据

load

load: string

树形加载子节点数据的函数，lazy 为 true 时生效，函数第二个参数包含了节点的层级信息

maxHeight

maxHeight: string

Table 的最大高度 合法的值为数字或者单位为 px 的高度。

rowClassName

rowClassName: string

行的类名的回调方法，也可以使用字符串为所有行设置一个固定的 className

rowClick

rowClick: string

当某一行被点击时会触发该事件

rowContextmenu

rowContextmenu: string

当某一行被鼠标右键点击时会触发该事件

rowDblclick

rowDblclick: string

当某一行被双击时会触发该事件

rowKey

rowKey: string

行数据的 Key，用来优化 Table 的渲染；在使用 reserve-selection 功能与显示树形数据时，该属性是必填的。类型为 String 时，支持多层访问：user.info.id，但不支持 user.info[0].id，此种情况请使用 Function

rowStyle

rowStyle: string

行的样式的回调方法，也可以使用一个固定的 Object 为所有行设置一样的 Style。

selectAll

selectAll: string

当用户手动勾选数据行的 Checkbox 事件

selectOnIndeterminate

selectOnIndeterminate: boolean

在多选表格中，当仅有部分行被选中时，点击表头的多选框时的行为。若为 true，则选中所有行；若为 false，则取消选择所有行

selectScript

selectScript: string

当用户手动勾选数据行的 Checkbox 事件

selectionChange

selectionChange: string

当选择项发生变化时会触发该事件

showHeader

showHeader: boolean

是否显示表头

showSummary

showSummary: boolean

是否在表尾显示合计行

size

size: ElTableSize

尺寸

sortChange

sortChange: string

当表格的排序条件发生变化的时候会触发该事件

spanMethod

spanMethod: string

合并行或列的方法

stripe

stripe: boolean

是否斑马纹 table

sumText

sumText: string

合计行第一列的文本

summaryMethod

summaryMethod: string

自定义的合计方法

tooltipEffect

tooltipEffect: string

tooltip effect 属性

treeProps

treeProps: Object

树形渲染嵌套数据的配置选项

vueData

vueData: any

Methods

checkAll

  • checkAll(): void

  • 用于多选表格，切换所有行的选中状态

    Returns void

checkRow

  • checkRow(rowIndex: number): void

  • 勾选某行

    Parameters

    • rowIndex: number

      行的位置

    Returns void

clearFilter

  • clearFilter(columnKey?: string): void

  • 不传入参数时用于清空所有过滤条件，数据会恢复成未过滤的状态，也可传入由columnKey组成的数组以清除指定列的过滤条件

    Parameters

    • Optional columnKey: string

      可选参数. 数组以清除指定列的过滤条件 为空时候清除所有的列的排序

    Returns void

clearSelection

  • clearSelection(): void

  • 清空打钩行

    Returns void

clearSort

  • clearSort(): void

  • 用于清空排序条件，数据会恢复成未排序的状态

    Returns void

Protected doDesigningDbClick

  • doDesigningDbClick(): void

  • Returns void

doGetClassName

  • doGetClassName(): any

  • Returns any

doGetCss

  • doGetCss(): ElTableStyle

  • Returns ElTableStyle

doGetMethods

  • doGetMethods(): {}

  • 事件

    Returns {}

doGetVueData

  • doGetVueData(): any

  • 设置默认值

    Returns any

doGetVueHtml

  • doGetVueHtml(): string

  • Returns string

doLayout

  • doLayout(): void

  • 对 Table 进行重新布局。当 Table 或其祖先元素由隐藏切换为显示时，可能需要调用此方法

    Returns void

doReSize

  • doReSize(): void

  • Returns void

doVueMounted

  • doVueMounted(): void

  • Returns void

findby

  • findby(fn: DataSourceQureyRowHandle, formIndex?: number): Row

  • 查找数据源的行

    Parameters

    • fn: DataSourceQureyRowHandle

      查找打回调函数

    • formIndex: number = 0

      可选参数 默认值:0

    Returns Row

    不存在返回null 否则返回行实例

findbyRowDatas

  • findbyRowDatas(data: object): Row

  • 通过数据对象查找数据源的行

    Parameters

    • data: object

      数据对象

    Returns Row

    不存在返回null 否则返回行数组

getAttrEditors

  • getAttrEditors(): AttributeEditorBase[]

  • 注意:使用注解注册属性编辑器这里不能少

    Returns AttributeEditorBase[]

getColumns

  • 返回Table的 列的数组

    Returns ElTableColumn[]

    列的数组

getColumnsHtml

  • getColumnsHtml(): string

  • Returns string

getColumnsMethods

  • getColumnsMethods(): {}

  • Returns {}

getCurrentRow

  • getCurrentRow(): any

  • 获取当前行

    Returns any

    返回当前行

getData

  • getData(): any[]

  • 获取数据

    Returns any[]

    返回数据数组

getDefalutCols

  • Returns ElTableColumn[]

getSelection

  • getSelection(): Row[]

  • 获取打钩的行

    Returns Row[]

    返回打钩行的数组

loadData

  • loadData(paramObj?: object): void

  • 加载数据

    Parameters

    • Optional paramObj: object

      参数

    Returns void

refreshRow

  • refreshRow(row: any[] | Row, rowIndex: number): void

  • 刷新指定的行(局部刷新) 全局刷新使用: loadData

    Parameters

    • row: any[] | Row

      行实例/行的数据数组

    • rowIndex: number

      可选参数 行的索引序号

    Returns void

setColumns

  • 设置table的列

    Parameters

    Returns void

setRowSelection

  • setRowSelection(row: Row, selected: boolean): void

  • 勾选/反勾选 行, 用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中）

    Parameters

    • row: Row

      行实例

    • selected: boolean

      勾选状态 true /false

    Returns void

sort

  • sort(prop: string, order: string): void

  • 手动对 Table 进行排序。参数prop属性指定排序列，order指定排序顺序。

    Parameters

    • prop: string

      属性指定排序列

    • order: string

      order指定排序顺序

    Returns void

Generated using TypeDoc