AvueAvue
首页
  • 开发指南
  • Skill开发
  • 在线测试工具
  • Form组件
  • Crud组件
  • Default组件
  • Data组件
  • Component组件
产品
工作台
授权
联系
2.x文档
个人支付接口
首页
  • 开发指南
  • Skill开发
  • 在线测试工具
  • Form组件
  • Crud组件
  • Default组件
  • Data组件
  • Component组件
产品
工作台
授权
联系
2.x文档
个人支付接口
  • CRUD API
  • Object对象用法
  • 表格虚拟化
  • 分页
  • 搜索
  • 表头配置
  • 表格行配置项
  • 表格列配置项
  • 数据字典
  • 操作栏配置
  • 增删改查方法
  • 按钮文案和图标
  • 按钮自定义
  • 弹窗表单配置
  • 深层结构数据
  • 卡片模式
  • 统计合计
  • 导入导出
  • 表格树
  • 父子表
  • 行编辑
  • 权限控制
  • 动态行列合并
  • 空状态
  • 等待加载
  • 拖拽排序
  • 其它类型
  • 表格高级用法
  • 大表哥(宇宙最强表格)
  • CRUD模块封装
  • CRUD极简增删改查封装

CRUD API

本页按 Avue 3.9.5 的 CRUD 实现整理。普通表格、卡片模式和虚拟表共用配置入口,但渲染能力不同;虚拟表的边界见 表格虚拟化。

option 用于字段和界面配置,组件 props 用于绑定数据和传入回调,事件由业务代码负责请求与保存。表中的「未设置」表示 Avue 没有覆盖该值,转交底层组件处理。

全局配置

app.use(Avue, {
  crudOption: {
    border: true,
    rowKey: 'id'
  },
  optionValidate: true
});

当前实例的 option 覆盖 crudOption 的同名顶层字段,不会逐列合并。只关闭当前实例的配置校验,应设置 option.optionValidate = false;全局关闭后,实例不会重新开启校验。

Crud 组件属性

属性类型 / 默认值说明
v-model / modelValueobject / {}弹窗新增、编辑、查看使用的表单对象,不是列表数组
dataarray / []当前显示的行数据,需显式传入;CRUD 不会自动按 pageSize 截取
optionobject / {}当前表格配置,需显式传入
v-model:searchobject / {}搜索表单对象;提交给接口的参数由 search-change 返回
v-model:pageobject / {}分页对象,结构见下表
table-loadingboolean / false列表加载遮罩,请在请求的 finally 中恢复
width、heightnumber / string,默认 null优先于 option 中的表格尺寸;虚拟表必须传数字
permissionobject / function,默认 {}如 { addBtn: false };函数签名 (key, row, index) => boolean,头部按钮没有行参数,未配置的权限默认允许
before-openfunction(done, type, loading);type 为 add/edit/view。调用 done() 继续打开;loading() 先显示弹窗和加载态,随后 done() 结束加载
before-closefunction(done, type);调用 done() 才继续关闭
span-methodfunction({ row, column, rowIndex, columnIndex }),返回 [rowspan, colspan] 或对应对象
summary-methodfunction({ columns, data }) => array,自定义合计行;配合 option.showSummary
row-class-namestring / function({ row, rowIndex }) => string,行样式类
cell-class-namestring / function({ row, column, rowIndex, columnIndex }) => string,单元格样式类
row-style、cell-styleobject / function行 / 单元格内联样式;函数入参与对应 class 回调一致
header-row-class-name、header-row-stylestring / object / function表头行样式;函数接收 { rowIndex }
header-cell-class-name、header-cell-stylestring / object / function表头单元格样式;函数接收 { row, column, rowIndex, columnIndex }

上传回调作为组件 props 传入,列上的同名配置可覆盖它们:

回调参数及用途
upload-before(file, done, loading, column),上传前,done 继续,loading 中止等待
upload-after(res, done, loading, column),上传成功后的处理
upload-delete(file, column),返回 false 或拒绝的 Promise 可阻止删除
upload-preview(file, column, done),自定义预览,done 继续默认预览
upload-error(error, column),上传错误
upload-exceed(limit, files, fileList, column),超出数量
upload-sized(fileSize, files, fileList, column),超出大小;配置名为 uploadSized,不是 uploadSize

Page 分页对象

字段类型默认值说明
currentPagenumber1当前页,从 1 开始
pageSizenumber10每页条数
totalnumber0总记录数,不是总页数;为 0 时分页区域隐藏
pageSizesnumber[][10, 20, 30, 40, 50, 100]可选每页条数
pagerCountnumber7可见页码按钮数
backgroundbooleantrue分页按钮背景
layoutstring'total, sizes, prev, pager, next, jumper'桌面默认布局;窄屏默认不含 jumper,显式配置优先
singlebooleanfalse只有一页时隐藏分页器
disabledboolean未设置禁用分页器

on-load(page) 在初次创建、用户改变页码和每页条数时触发;改变条数会先回到第 1 页。只修改 page.currentPage 不会代替业务请求。不要在 on-load、current-change、size-change 中重复请求同一份数据。完整示例见 分页与搜索。

Option 表格配置

数据、布局和展示

配置类型 / 默认值说明
columnarray / object列配置;数组用于显式顺序,对象形式以键作为默认 prop
optionValidateboolean / true当前配置校验开关,受全局开关约束
rowKeystring / 'id'稳定且唯一的主键;编辑、删除、选择、树形数据均依赖它
rowParentKeystring / 'parentId'树形数据新增子节点、局部更新所用的父节点字段
sizestring / 'default'large/default/small;依次继承全局 tableSize、size
heightnumber / string固定高度,或 'auto' 按窗口计算高度
calcHeightnumber / 0自动高度的额外扣减量,与全局 calcHeight 相加
widthnumber / string,默认 '100%'普通表格宽度;虚拟表使用组件的数字 :width
maxHeightnumber / string最大高度;自动高度模式使用计算结果
border、stripeboolean / 未设置纵向边框、斑马纹
fit、showHeaderboolean / 未设置列宽自撑、是否显示表头,沿用底层表格默认值
headerboolean / true是否显示表格上方工具栏,与 showHeader 不同
menuLeft、menuRightboolean / true左 / 右工具栏区域
cardboolean / false搜索、表格、分页容器使用卡片阴影
title、titleSize、titleStylestring / string / object标题内容、标题标签(默认 h2)和样式
align、headerAlignstring普通列内容 / 表头对齐方式:left/center/right;列配置优先
emptyTextstring空列表文字,默认使用当前语言的「暂无数据」
highlightCurrentRowboolean高亮当前行,与多选相互独立
defaultSortobject{ prop, order: 'ascending' / 'descending' },没有默认排序列
showOverflowTooltip、overHiddenboolean / object全局溢出提示配置
tooltipEffect、tooltipOptions、tooltipFormatterstring / object / function透传表格的 Tooltip 配置;tooltipOptions 不是方向字符串
scrollbarAlwaysOn、flexible、tableLayoutboolean / boolean / string透传底层表格;布局可设 fixed/auto
allowDragLastColumn、appendFilterPanelToboolean / string透传列宽调整、筛选浮层挂载配置,需底层 Element Plus 支持
pageboolean / true是否显示分页区域,仍需 page.total !== 0
showSummary、sumColumnListboolean / array合计开关与规则,规则为 { name, type: 'sum/count/avg', label, decimals },精度默认 2
loadingText、loadingSpinner、loadingSvg、loadingBackgroundstring列表及弹窗加载态的文字、图标和背景
filterDicboolean / false为 true 时,普通列展示字典标签时不额外写入行的 $prop 标签字段

序号、选择、展开与树

配置类型 / 默认值说明
index、indexLabelboolean / string,默认 false / '#'序号开关与标题,序号包含分页偏移
indexWidth、indexFixednumber / boolean / string,默认 50 / 'left'序号宽度、固定位置
selection、selectionWidth、selectionFixed默认 false / 50 / 'left'多选列开关、宽度、固定位置
reserveSelectionboolean / false按稳定 rowKey 保留选择,卡片跨页示例见 卡片模式
selectablefunction(row, index) => boolean,控制用户能否勾选
tipboolean / true多选时显示已选择数量和清空操作
indeterminateboolean / false树表半选样式,配合底层树表选择能力
expand、expandWidth、expandFixed默认 false / 60 / 'left'展开详情列配置;通过 expand 插槽填内容
indexClassName、selectionClassName、expandClassNamestring对应辅助列的单元格类名
indexLabelClassName、selectionLabelClassName、expandLabelClassNamestring对应辅助列的表头类名
treeboolean显式声明树表;普通 children 数据可自动识别,自定义子字段时建议显式设置
treePropsobjectchildren、hasChildren 默认字段及底层树表参数,如 checkStrictly
lazyboolean / false树节点懒加载,配合 tree-load 和 hasChildren
defaultExpandAllboolean默认展开所有行
expandRowKeysarray控制展开的行主键集合,需要 rowKey

工具栏和操作按钮

配置类型 / 默认值说明
menu、menuTitleboolean / string,默认 true / 当前语言「操作」行操作列
menuWidth、menuXsWidthnumber / 220、100桌面 / 窄屏操作列宽
menuFixedboolean / string,默认 'right'操作列固定位置
menuAlign、menuHeaderAlignstring / 'center'操作列内容和标题对齐
menuClassName、menuLabelClassNamestring操作列单元格和表头类名
menuTypestring / 'text'button/text/icon/menu,全局 menuType 可覆盖默认值
menuBtnTitlestringmenuType: 'menu' 的下拉按钮文字
addBtn、editBtn、delBtnboolean / true新增、编辑、删除
viewBtn、copyBtn、addRowBtn、cellBtnboolean / false查看、复制新增、行内新增、行内编辑按钮
saveBtn、updateBtn、cancelBtnboolean / true弹窗保存、修改、取消;行编辑也使用保存和取消配置
refreshBtn、columnBtn、gridBtn、searchShowBtnboolean / true刷新、列设置、卡片切换、搜索区显隐按钮
printBtn、excelBtn、filterBtn、dateBtnboolean / false打印、导出、自定义过滤、日期范围工具
addBtnText / addBtnIcon 等string以上操作按钮的文案和图标,可按按钮名配置 Text / Icon
addTitle、editTitle、viewTitlestring新增、编辑、查看弹窗标题

弹窗和搜索

配置类型 / 默认值说明
dialogTypestring / 'dialog'dialog/drawer
dialogDirectionstring抽屉方向 rtl/ltr/ttb/btt
dialogWidthnumber / string,桌面默认 '60%'窄屏默认全宽;数字按像素处理
dialogTopstring普通弹窗顶部距离,如 '10vh'
dialogDrag、dialogFullscreenboolean / false弹窗拖拽、初始全屏
dialogAppendToBodyboolean / true是否挂载到 body
dialogClickModalboolean / false点击遮罩关闭
dialogEscape、dialogCloseBtn、dialogModalbooleanESC 关闭、关闭按钮、遮罩,沿用底层默认值
dialogCustomClass、headerClass、bodyClass、footerClassstring弹窗及分区类名
modalPenetrableboolean透传底层弹窗遮罩穿透配置
dialogMenuPositionstring / 'right'弹窗按钮对齐:left/center/right
searchShow、searchShowBtnboolean / true初始显示搜索区、显示搜索切换按钮
searchBtn、emptyBtnboolean搜索提交 / 清空按钮,默认显示
searchBtnText、emptyBtnTextstring搜索 / 清空文字
searchBtnIcon、emptyBtnIconstring搜索 / 清空图标
searchSpan、searchLabelWidthnumber / 6、80全局搜索栅格宽度与标题宽度,列配置优先
searchGutter、searchSize、searchLabelPositionnumber / string / string搜索间隔、组件尺寸、标题位置
searchIconboolean半折叠开关,继承全局 searchIcon,默认不开启
searchIndexnumber / 2半折叠时显示的搜索项数量
searchMenuPosition、searchMenuSpanstring / number搜索按钮位置默认 center;按钮栅格默认跟随搜索栅格
searchEnter、searchMenuBtnboolean对应搜索表单的 Enter 提交、底部按钮区域,具体沿用 Form

拖拽、卡片和虚拟表

配置类型 / 默认值说明
sortable、rowSort、columnSortboolean / false同时拖拽、只拖行、只拖列;挂载前需加载 Sortable
gridboolean / false初始使用卡片模式
gridSpan、gridXsSpannumber / 8、12桌面 / 窄屏卡片栅格,24 表示整行
gridBackgroundstring / function背景或 (row, index) => background
gridBackgroundImagestring卡片背景图地址
virtualizeboolean / false使用 ElTableV2,需显式传组件的数字 :width / :height
fixedboolean虚拟表的列布局策略,区别于每一列的 fixed
expandColumnKeystring虚拟树表展开列的 key,对应列 prop

列状态持久化(3.9.2+)

配置类型 / 默认值说明
columnStateKeystring启用持久化的业务唯一 key;兼容别名 columnPersistKey、tableId
columnStateboolean / true还需有 key 才会启用
columnStateStoragestring / 'localStorage'可使用 sessionStorage
columnStateAutoSaveboolean / true是否在状态变化时保存
columnStateLoadfunction(key, option) => state,同步返回状态对象
columnStateSavefunction(state, key, reason, option),自定义保存
columnStateRemovefunction(key, option),自定义删除

保存内容是列顺序及列的 hide/fixed/filters/sortable/width 配置;不包含当前选择的筛选值或升降序结果。详见 列状态示例。

Column 列配置

展示与表单

配置类型 / 默认值说明
prop、labelstring字段唯一标识、列标题
type、value、rulesstring / any / array表单组件类型、初始值、校验规则,详见 Form 配置
childrenarray多级表头的子列配置
hideboolean / false在表格中隐藏此列
showColumnboolean / true是否在列设置中显示此字段;设 false 也会影响默认导出列
width、minWidthnumber / string固定宽度 / 分配剩余空间时的最小宽度;虚拟列应给数字 width
fixedboolean / stringtrue/left/right;普通列在窄屏中会取消固定
resizableboolean是否允许拖动列宽,普通表格需 border: true
align、headerAlignstringleft/center/right,优先于表格全局值
className、labelClassNamestring单元格 / 表头类名
indexnumber显式列顺序,按数值升序排列
bindstring嵌套取值路径,例如 'user.name'
formatterfunction(row, value, label, column) => 内容;value 为原始字段值,label 为字典 / 日期格式化后的值
htmlboolean / false将格式化结果作为 HTML 渲染,适用于可信内容
ellipsisboolean / false文本省略并使用原生 title 提示
overHidden、showOverflowTooltipboolean / object溢出 Tooltip
tooltipFormatterfunction直接传给 Element Plus 表格列,接收底层 Tooltip 上下文;不是 Avue 的四参数 formatter
sortableboolean / 'custom'列排序;custom 时由 sort-change 发起业务请求
sortMethod、sortBy、sortOrdersfunction / string / array透传普通列的排序规则
filtersboolean / arraytrue 从共享字典或当前数据生成选项;数组格式 [{ label, value }]
filterMethodfunction(value, row, column) => boolean,本地过滤
filterMultipleboolean / true多选筛选
filteredValue、filterPlacementarray / string已选筛选值、筛选浮层方向
gridRowboolean / false卡片字段另起一行
cellboolean / false行编辑时使用此字段的编辑组件
display、addDisplay、editDisplay、viewDisplayboolean表单显隐;通用 display 优先,默认显示
disabled、addDisabled、editDisabledboolean表单禁用;通用 disabled 优先,查看模式只读
span、labelWidth、order、controlnumber / number / number / function沿用 Form 的布局、排序和联动配置
renderfunction({ row, column, index, dic, params, event }) => VNode,普通表格内容;自行从 Vue 导入 h
renderForm、renderSearchfunction表单 / 搜索自定义渲染,接收自定义组件上下文对象
renderHeaderfunction普通表格头部渲染,接收底层 { column, $index }
cellRenderer、headerCellRendererfunction虚拟表渲染,使用 rowData/cellData/rowIndex 等 V2 上下文

字典

配置类型 / 默认值说明
dicDataarray / function静态数组,或 (column) => array / Promise<array>
dicUrlstring字典接口 URL
dicMethodstring / 'get'GET 的 dicQuery 放入 params,其余方法放入请求体
dicQuery、dicHeadersobject / {}请求参数、请求头;支持完整模板值
dicFormatterfunction(res, form) => array,res 已取 Axios 的 response.data
dicFlagboolean / 未设置false 跳过自动网络字典;true 允许弹窗重新请求,不能把默认值统一理解成 false
dataTypestring字典和字段的类型转换,如 string/number/array/json
propsobject字典字段映射,见下表
cascader、cascaderIndexstring[] / number联动的子字段、子字典默认选项下标
remote、lazyboolean远程搜索或懒加载,由对应输入组件处理,不走普通逐行字典
props 字段默认值用途
label、valuelabel、value标签和值
children、disabledchildren、disabled子级和禁用标记
res未设置从 Axios response.data 中继续取值的路径;未设置时尝试其中的 data,否则使用自身

普通逐行字典中的 {{key}} 是当前列值,级联子列中取上级值,远程搜索中取搜索词。完整用法和请求范围见 数据字典。

搜索字段

配置类型 / 默认值说明
searchboolean / false将字段加入搜索表单
searchPropstring仅在提交参数中改名,不改变原始 v-model:search 的字段
searchValueany搜索初始值
searchType、searchRangestring / boolean搜索组件类型、范围输入
searchOrdernumber / 0数值越大越靠前,不改变表格列顺序
searchSpan、searchLabelWidthnumber优先于全局搜索布局
searchPlaceholder、searchLabelPosition、searchSizestring搜索提示、标题位置、尺寸
searchRules、searchControlarray / function独立的搜索校验和联动逻辑
searchDisabled、searchReadonly、searchClearableboolean搜索输入状态;未设置时沿用对应组件规则
searchMultiple、searchTags、searchRowboolean多选、选中值文本展示、单独换行
searchTip、searchTipPlacementstring搜索项提示及方向

Events

数据、搜索与分页

事件参数触发与处理
row-saverow, done, loading新增提交;保存成功调用 done,失败调用 loading 结束提交态
row-updaterow, index, done, loading编辑提交;index 是当前绑定列表中的下标
row-delrow, index, done删除操作;done() 从本地列表删除该主键记录,不会请求接口
on-loadpage首次、用户切页、改变条数
current-change、size-changecurrentPage / pageSize分页变化通知,已同时触发 on-load
prev-click、next-clickcurrentPage分页上一页 / 下一页点击
search-changeform, done提交后的参数已去掉空值及 $ 字段,并应用 searchProp;业务自行回第 1 页,结束时调用 done
search-resetsearchForm搜索清空后通知;不会自动请求列表
search-icon-changeexpanded搜索半折叠展开状态
refresh-change无工具栏刷新,需要业务重新加载
date-change日期组件的 change 对象dateBtn 的日期变化,选中值在 params.value
changeform弹窗表单模型变化
error校验错误对象弹窗提交校验未通过
tab-clicktab, event弹窗分组标签切换
dic-error{ type, error }字典请求失败;可结合实例的 dicLoading/dicError 展示状态
filter[[prop, operator, value], ...]自定义过滤弹窗提交条件,由业务处理
update:modelValue、update:search、update:page新值对应 v-model 的更新事件

弹窗的 done() 关闭窗口;done(savedRow) 还会按主键把返回记录同步到本地列表。行编辑的 done(savedRow?) 结束该行编辑并更新记录。使用服务端重新取列表时,一般调用无参数 done() 即可;新增行编辑应带回服务端生成的主键。详见 增删改查。

表格交互

事件参数说明
selection-changeselection已选集合变化
selection-clear清空前的已选集合通过 CRUD clearSelection 清空时通知
select、select-allselection, row / selection普通表格手动勾选 / 全选
current-row-changecurrentRow当前实现只转发当前行,不转发 oldCurrentRow
tree-loadrow, treeNode, resolve异步加载后调用 resolve(children),无子项也需 resolve([])
expand-changerow, expandedRows 或 row, expanded展开列返回行数组,树表返回布尔值
sort-change{ column, prop, order }普通表格列排序
filter-change{ [prop]: values[] }普通表格列筛选
sortable-changeoldIndex, newIndex, row, sortedList行拖拽;3.9.5 自动同步 data,不需要 refreshTable
column-sortable-change见下方说明列拖拽及列设置排序
header-dragendnewWidth, oldWidth, column, event列宽拖动结束
column-state-changestate, reason持久化状态保存
column-state-resetcolumnStateKey持久化状态重置
grid-status-changeisGridtrue 为卡片,false 为普通表格
scroll底层滚动对象普通表格包含 scrollLeft/scrollTop
row-click、row-contextmenurow, column, event普通表格行点击 / 右键
row-dblclickrow, column当前普通表格包装器只转发前两个参数
cell-click、cell-dblclick、cell-mouse-enter、cell-mouse-leaverow, column, cell, event普通表格单元格交互
header-click、header-contextmenucolumn, event表头点击 / 右键

3.9.5 的列排序会发出 { oldIndex, newIndex, column } 对象;表头拖拽路径还会兼容触发一次 (oldIndex, newIndex)。保存到接口时只处理其中一种,避免重复提交,例如只接受对象参数。卡片模式的行点击 / 双击参数为 (row, index),单元格点击 / 双击为 (row, column);不要按普通表格的 DOM 事件参数使用。

Methods

通过 ref 调用。弹窗表单方法应在窗口打开后的回调或 nextTick 中使用。

方法参数 / 返回值用途
rowAdd()无打开新增窗口
rowEdit(row, index)、rowView(row, index)当前记录及下标打开编辑 / 查看窗口
rowCopy(row)当前记录复制数据、移除主键后打开新增窗口
rowSave()、rowUpdate()无主动触发当前弹窗提交及校验
rowDel(row, index)当前记录及下标触发 row-del 事件,不自动删除
closeDialog()无关闭弹窗,仍经过 before-close
validate(callback)callback(valid, loading, errors)弹窗校验;当前实现不返回 Promise。校验成功会进入禁用状态,用 loading() 结束
validateField(props, callback?)string / string[]弹窗字段校验,透传内部 Form
clearValidate(props?)string / string[]清除校验;弹窗打开前对应行编辑表单,打开后由弹窗表单方法接管
resetForm(reset = true)boolean弹窗表单重置;false 不清空字段,只清理校验;两者都会触发弹窗关闭流程。CRUD 没有 resetFields 包装方法
getPropRef(prop)字段名获取弹窗字段组件
rowCellAdd(row?)初始行数据添加一条处于编辑态的行
rowCellEdit(row, index)、rowCellUpdate(row, index)当前记录及下标进入行编辑 / 校验并触发行保存事件
rowCancel(row, index)当前记录及下标取消行编辑,未有主键的新行会移除
validateCellForm()Promise<errors>校验行编辑表单,结果为错误集合,不是布尔值
clearSelection()无清空选择,并触发 selection-clear
toggleSelection(rows?, checked?)行数组、可选布尔值不传 rows 时清空;true 强制选择,false 取消,否则切换
toggleRowSelection(row, selected?, ignoreSelectable?)透传底层表格选择单行,具体第三参数能力取决于 Element Plus
toggleAllSelection()无当前页全选 / 取消全选
getHalfSelectionRows()返回底层结果取得树表半选行,需要底层版本支持
toggleRowExpansion(row, expanded?)记录、可选布尔值展开 / 收起
setCurrentRow(row?)记录设置 / 清除高亮行
clearFilter(keys?)、clearSort()字段数组 / 无清理普通表格筛选 / 排序
doLayout()无容器显示后重新计算布局
scrollTo(...args)、setScrollTop(top)、setScrollLeft(left)透传底层滚动控制
updateKeyChildren(key, children)行主键、子数组刷新已加载的懒加载子节点,需要底层表格支持
refreshTable(callback?)回调重新挂载表格并清空选择,不请求业务数据
searchReset()无重置搜索表单,触发 search-reset
searchChange(form, done?)搜索对象、结束回调规范化参数后发出 search-change,不会自行请求接口
dicInit(type?)Promise无参数刷新网络及普通逐行字典;传 'cascader' 刷新表格级联字典
updateDic(prop, list?)Promise指定字段字典;不传有效 list 且有 dicUrl 时重新请求
getRowDic(row, column)array / undefined取得当前行实际使用的字典
resetColumnState(callback?)回调清除当前 key 状态并恢复初始列配置
rowExcel()、rowPrint()无打开导出面板 / 打印当前表格

字典请求失败通过 dic-error 通知并返回 null,不要仅依靠 dicInit().catch() 显示错误。普通表格未被 CRUD 包装的方法可在确认底层类型后通过 crudRef.value.$refs.table 调用,例如 table.sort(prop, order);虚拟表和卡片没有全部普通表格方法。

Slots

prop 表示列字段名。以下名称使用短横线,例如 search-menu,不是 searchMenu。

插槽作用域参数用途
prop{ row, column, tableColumn, index, dic, size, label }普通表格 / 卡片自定义单元格
prop-header{ column, $index }普通列标题
prop-search搜索字段的 Form 作用域自定义搜索输入
prop-form字段的 Form 作用域及 type弹窗 / 行编辑的自定义输入
prop-label、prop-error、prop-desc、prop-type对应 Form 作用域及弹窗 type字段标题、错误、描述、组件类型内容
search{ row, search, size }搜索区自定义内容
search-menuForm 菜单作用域及 row/search搜索按钮区追加内容
header、body、footer无工具栏前、表格前、表格后
empty无空数据内容
page无分页区域中追加内容,仍受 total 和 option.page 控制
tip{ selection, count }已选提示区域追加操作
expand{ row, index }展开行内容
menu-left、menu-right{ size }表格上方左右工具栏追加按钮
menu-header底层表头作用域及 size操作列标题
menu-before、menu{ row, column, index, size, disabled, type }默认行按钮之前 / 之后追加内容
menu-btn-before、menu-btn同上下拉菜单中默认选项之前 / 之后追加内容
menu-form-before、menu-form{ type, size, disabled }弹窗默认按钮之前 / 之后追加内容

菜单插槽通常是追加区域;需要完全替换时,先关闭相应默认按钮。虚拟表内容使用 cellRenderer,不经过上述普通列内容插槽。

最后更新:
贡献者: smallwei
Next
Object对象用法