# FxLwtTable组件
用于展示拼表表格。
# Attributes
参数 | 说明 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
id | 拼表id(必填) | String | — | - |
tableHeight | 表格高度 | Number | — | - |
tableWidth | 表格宽度 | Number | — | - |
pageSize | 一页多少条数据 | Number | — | - |
pageNumber | 页码 | Number | — | - |
filterList | 筛选条件 | Array | — | - |
# 简单使用
组件通过 FxUI.component.get('BILwtTable')
获取。
# 使用
- 通过调用
setQueryParams
设置请求参数 queryData
发送请求
代码示例:
<template>
<div id="graphWrap">
<lwt-table
class="tableWrap"
v-loading="loading"
fx-loading-text="拼命加载中"
ref="BITable"
:key="id"
:table-height="tableHeight"
:table-width="tableWidth"
@onLwtMounted="lwtMounted"
:on-after-render="afterRender"
></lwt-table>
</div>
</template>
<script>
export default {
components: {
LwtTable: FxUI.component.get('BILwtTable')
},
data() {
return {
id: 'BI_lwt_1658322497512',
filterList: [],
queryParams: {},
tableHeight: 500,
tableWidth: 800,
tableHeadFieldList: [],
loading: false,
}
},
methods: {
lwtMounted() {
this.loading = true;
this.queryParams = {
id: this.id, // 必填
filterList: [],
pageSize: 20,
pageNumber: 1,
};
this.$refs.BITable.$refs.lwtCom && this.$refs.BITable.$refs.lwtCom.lwtQuery.setQueryParams(this.queryParams);
this.$refs.BITable.$refs.lwtCom && this.$refs.BITable.$refs.lwtCom.queryData();
},
afterRender() {
console.log('加载完成')
this.loading = false
}
}
}
</script>
# 组件扩展
为了满足企业定制化的需求,这里我们为开发者提供了一些扩展方式,能够快速开发出相应功能。
# 组件插槽
组件插槽的机制允许开发人员将某个组件或某个类型的组件替换成自己开发的组件,从而修改该字段的交互形式。