YsTableTemplate模板
表格模板
TIP
下载文档的按钮，操作列需要 需要设置 prop: 'operation',下载的文档才会过滤操作列；这个下载只是前端的下载，如果需要下载全部的，这个需要跟后端沟通，让后端提供接口了；这里就不在叙述了，请自行 google
属性
TIP
部分属性没有展示,可以参考基础模板表格文档ys-table
| 参数 | 说明 | 类型 | 默认参数 | 是否必传 |
|---|---|---|---|---|
| data | 组件数据双向绑定 | Array | [] | 是 |
| header | 模板头部配置 | object | 说明 | 否 |
| pagination | 翻页参数,翻页当前页码跟条数的配置取自requestParams的page,limit;不存在的话会默认1,跟20 | object | 说明 | 否 |
| paginationShow | 是否显示翻页 | boolean | true | 否 |
| props | 表格模板配置 | object | -- | 是 |
| fetch | 数据接口 当这个有值的时候，会自动请求数据并覆盖data数据，渲染到页面;接口会返回方法response,可以用于接听返回数据; 可以直接放接口方法,也可以使用箭头 :fetch="(_parmas: any) => getData(_parmas)" :fetch="getData" | function|Promise方法 | -- | 否 |
| requestParams | 接口初始请求参数 | object | -- | 否 |
header 配置
| 参数 | 说明 | 类型 | 默认参数 | 是否必传 |
|---|---|---|---|---|
| actionbar | 是否开启动作栏插槽 | boolean | true | 否 |
| show | 是否显示 | boolean | true | 否 |
| toolbar | 头部右侧操作模板,配置三个按钮 | toolbar: { refresh: true, 刷新按钮 filter: true, 过滤按钮 export: true 导出按钮 } | object | 否 |
props 配置
| 参数 | 说明 | 类型 | 默认参数 | 是否必传 |
|---|---|---|---|---|
| limit | 翻页页码请求参数别名 | string | 否 | |
| page | 翻页页数请求参数别名 | string | 否 | |
| spaceSize | 按钮间距 包括toolbar,以及插槽模板 | number | 12 | 否 |
事件
提示
el-table 的事件都可以都可以使用
自定义事件
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| response | 当配置接口方法的时候,会回调接口返回的数据 | response |
Table 方法
提示
通过ref调用组件getYsTableRef的方法;则会返回ys-table内的table ref;然后调用el-table的方法
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| getYsTableRef | 返回表格内组件ref | ref |
| refreshHandle | 保留当前的参数，并刷新表格方法 | |
| init | 根据请求参数，初始化表格，并调用接口重新渲染，如果需要重置翻页参数，请调用改方法，翻页参数并没有返回给父组件，所以refreshHandle是无法重置翻页参数的 | |
| radioData | 单选返回的选中数据 | row |
slots 插槽
| 插槽名 | 说明 |
|---|---|
| actionbar | 动作栏左侧插槽，需要开启header内的actionbar开启 |