Fast-Table 快速表格
基于 search-form
pagination
table
及表单组件聚合而成的快速表格模板,用以支持快速业务开发
基础用法
INFO
如果你的业务基础请求和当前组件的分页处理不一致,你可以抽取公共方法,转换成新的 Promise
来适配该组件,同时你也可以处理除分页参数以外的其他业务参数。
组合使用
INFO
你可以使用 header
插槽快速获取选择项,row-key
的值默认是 id
, 在处理选择项这个是非常有必要指定的。
属性
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
api | 快速的接口服务 | Promise<Response> | - |
v-model:columns | table-columns 类型 | Table-Columns | - |
v-model:loading | 异步请求状态 | boolean | - |
v-model:params | 表单的查询参数,同分页信息双向绑定 | SearchParams | - |
... | 其他属性,直接传递给 ez-table | - | - |
INFO
fast-table
其他属性传递给 ez-table
,最后传递到 el-table
SearchParams
属性名 | 说明 | 类型 | 是否必须 | 默认值 |
---|---|---|---|---|
current | 当前页数,同分页配置双向绑定 | number | 否 | 1 |
size | 每页显示条目个数,同分页配置双向绑定 | number | 否 | 10 |
desc | 自定义排序中降序排序字段 | string | 否 | - |
asc | 自定义排序中升序排序字段 | string | 否 | - |
... | 其他属性,自有业务参数 | Record | 否 | - |
插槽
插槽名 | 说明 | 类型 |
---|---|---|
${prop} | 数据列插槽,同 ez-table | object |
form | 传递给 search-form | - |
header | 表格上方区域 | object |
事件
事件名 | 说明 | 参数 |
---|---|---|
update:loading | 监听异步请求状态 | Function |
update:params | 监听查询参数变更 | Function |
changePage | 分页大小或当前页变更,可根据值判断变更类型 | Function |
... | 其他事件,直接传递给 ez-table | - |
INFO
fast-table
其他事件传递给 ez-table
,最后传递到 el-table
Exposes
方法名 | 说明 | 类型 |
---|---|---|
getTableRef | 获取 el-table 实例 | Function |
query | 直接触发 api 调用 | Function |
search | 触发 api 调用,会重置current = 1 | Function |