Appearance
属性
javascript
// 数据表格组件的配置对象
datatable: {
// 表示该组件是否为容器类型
isContainer: false,
// 组件的显示名称
displayName: "数据表格",
// 表示该组件是否为表单类型
isForm: true,
// 组件内部的子组件列表
widgetList: [],
// 是否允许添加数据表格查询功能
canAddDataTableQuery: false,
// 是否允许添加数据表格列表功能
canAddDataTableList: false,
// 组件是否完整
complete: true,
// 组件的属性配置
props: {
// 是否包含标签
hasLabel: true,
// 标签的文本内容
label: "数据表格",
// 是否显示详细信息
isDetail: false,
// 组件的宽度,单位为格
width: 24,
// 是否隐藏组件
hide: false,
// 组件的中文名称字段
zdname: null,
// 组件的值字段
value: null,
// 组件的API设置
apiSet: {
// HTTP请求方法
method: "post",
// API的URL地址
apiurl: "",
// 请求参数列表
params: [],
// 请求头列表
headers: [],
// 请求内容的类型
contentType: "JSON",
// 请求参数的格式化字符串
paramsFormat: "",
// 请求头的格式化字符串
headersFormat: "",
// 成功响应的格式化字符串
successFormat: "",
// 错误响应的格式化字符串
errorFormat: "",
},
// 空数据时显示的文本
emptyText: "没有更多数据了!",
// 组件的大小风格
size: "small",
// 组件的高度,单位为视口高度的百分比
height: "80vh",
// 操作列的宽度
oprateWidth: null,
// 数据列表的字段名
rows: "ListOrders",
// 数据总数的字段名
count: "OrderCount",
// 当前页码的字段名
page: "pageIndex",
// 每页显示条数的字段名
limit: "pageSize",
// 默认每页显示的条数
pageDefault: 20,
// 数据对齐方式
align: "left",
// 是否允许单选
singleselect: false,
// 表格边框风格
border: "default",
// 是否包含分页功能
hasPage: true,
// 是否在组件加载时初始化数据
initLoadData: true,
// 是否显示滚动条
showOverFlow: true,
// 是否为必填项
required: true,
// 是否显示斑马纹
isStripe: true,
// 是否隐藏选择功能
isHideChoose: false,
// 是否隐藏查询功能
isHideQuery: false,
// 是否隐藏按钮
isHideButton: false,
// 是否隐藏序号列
isHideIndex: false,
// 是否隐藏表头
isHideHeader: false,
// 是否隐藏查询按钮
isHideQueryBtn: false,
// 是否隐藏重置按钮
isHideResetBtn: false,
// 是否允许当前行点击时高亮
isCurrendClick: true,
// 是否为非自动模式
isNotAuto: false,
// 是否为树形表格模式
treeMode: false,
// 树形结构的唯一标识字段
treeRowField: "id",
// 树形结构的父级字段
treeParentField: "pid",
// 树形结构的子级字段
treeChildrenField: "children",
// 合并行的唯一标识字段
mergeRowKey: null,
// 树形结构的转换模式,false为树形结构,true为扁平结构
treeTransform: false,
// 是否展开所有树形结构
treeExpandAll: false,
// 是否启用树形结构的手风琴效果
treeAccordion: false,
// 是否显示行线
isLine: false,
// 单元格的样式
cellStyle: null,
// 行的样式
rowStyle: null,
// 单元格的CSS类名
cellClassName: null,
// 行的CSS类名
rowClassName: null,
// 组件创建时的回调函数
onCreated: null,
// 组件挂载时的回调函数
onMounted: null,
// 数据加载时的回调函数
onDataLoad: null,
// 表头的树形结构配置
headerTree: [],
}
}
方法
名称 | 描述 | 示例 |
---|---|---|
app.getPropsById | 获取当前组件参数值 | app.getPropsById({id}) |
app.setVisible | 设置可见 | app.setVisible({id}, false) |
app.chosen | 获取当前选中行数据 | app.getMethodById({id}).chosen() |
app.refresh | 刷新表格 | app.getMethodById({id}).refresh() |
app.getRows | 获取表格数据 | app.getMethodById({id}).getRows() |
app.setRows | 设置表格数据 | app.getMethodById({id}).setRows([]) |
app.setTotal | 设置表格数据总数 | app.getMethodById({id}).setTotal(0) |
app.getSearchParams | 获取搜索参数 | app.getMethodById({id}).getSearchParams() |
app.allTreeChosen | 获取选中 id | app.getMethodById({id}).allTreeChosen() |
app.setRowsCheckedByIds | 通过 id 数组设置选中 | app.getMethodById({id}).setRowsCheckedByIds([]) |
app.addRow | 新增行数据 | app.getMethodById({id}).addRow({}) |
app.addRowByDefault | 新增行数据默认值 | app.getMethodById({id}).addRowByDefault() |
app.removeRow | 删除行数据 | app.getMethodById({id}).removeRow(row) |
app.setAllTreeExpand | 展开树形表格 | app.getMethodById({id}).setAllTreeExpand(true) |