动态创建数据组件
数据组件支持动态创建，数据组件的构造方法如下
方法：
constructor(page, id, props, context)
描述：
创建数据组件
参数：
page：{Page} - 页面对象
id：{String} - 组件 id
props：{JSON} - 组件属性，格式如下
{
defCols：{JSON} - 定义列信息，包括列类型、规则，格式如下
{
"列标识": {
"label": 列名称,
"type": 类型,
"readonly": function (row) { return false },//只读
"default": function () { return "默认值" },//默认值
"calculate": function (row) { },//计算
"required": {//必填
"fn": function (row) { return true; },
"msg": "必填规则提示信息",
},
"constraint": {//约束
"fn": function (row) { return true },
"msg": "约束规则提示信息",
}
}
}
initData：[{JSON}] - 定义初始化数据，格式如下
[{
"列标识1": 值,
"列标识2": 值,
...
}]
options：{JSON} - 定义 idColumn、autoMode 等属性，格式如下
{
"idColumn": 主键列标识
"autoMode": 自动模式，支持3种情况：load（自动加载 initData 中的数据）、new（自动新增）、空（不加载也不新增）
"className": 数据集类名,
"tableName": 表名,
"restResource": 固定值 class,
"serviceName": 服务名,
"url": 固定值 /dbrest,
"limit": 分页数据大小,
"orderBy": 排序，支持多列排序，格式如下
[{
"name": 列标识,
"type": 排序方式：1 升序 0 降序
}],
"treeOption": 树形配置，格式如下
{
"isTree": 是否树形数据,
"parent": 父列,
"fullId": 全路径 ID 列,
"leafCol": 叶子节点列,
"levelcol": 层级列
"loadAll": 是否加载全部树形数据,
"children": 子节点列
},
"dataReadonly": function (data) { return false }//全部只读
}
}
context：{Context} - 页面上下文
返回值：
数据组件对象
引用数据组件，代码如下
import RestData from "$UI2/wxsys/comps/restData/restData";
import TableData from "$UI/wxsys/comps/tableData/tableData";
创建自定义数据组件
案例一
创建一个有两列数据（id、name）、且自动新增数据的数据组件，代码如下
let customDataConfig = {
"defCols": {
"id": {
"label": "主键",
"type": "string"
},
"name": {
"label": "名称",
"type": "string"
}
},
"options": {
"autoMode": "new",
"idColumn": "id"
}
}
let customData = new TableData(this, "customData", customDataConfig);
案例二
创建一个带初始数据、列规则的数据组件，代码如下
let customDataConfig = {
"defCols": {
"id": {
"label": "id",
"type": "string"
},
"name": {
"label": "名称",
"type": "string",
"default": function () { return "默认值" },
"readonly": function (row) { return false },
"calculate": function (row) { return row.id + "-01" },
"required": {
"fn": function (row) { return true; },
"msg": "名称必填",
},
"constraint": {
"fn": function (row) { return row.name != "aa" },
"msg": "不能为aa",
}
}
},
"initData": [
{
"id": "1",
"name": "1",
},
{
"id": "2",
"name": "2",
}
],
"options": {
"autoMode": "load",
"idColumn": "id",
"dataReadonly": function (data) { return false }
}
}
let customData = new TableData(this, "customData", customDataConfig);
创建动态数据组件
创建动态数据集对应的数据组件，和创建自定义数据组件，主要的区别是，options 中需要给出 className、tableName、restResource 等属性，这几个属性的值可以参考 w 文件中数据组件属性的值
创建普通数据组件
例如：商品表的数据组件定义如下，其中 className 是 /main/product，tableName 是 product，restResource 是固定值 class
<wx:restData auto="load" className="/main/product" id="productData" label="商品" limit="3" restResource="class" url="/dbrest" version="2.0.33"/>
使用 JS 代码动态创建“商品表”的数据组件，代码如下
let config = {
"defCols": {
"fid": {
"label": "主键",
"type": "string"
},
"name": {
"label": "名称",
"type": "string",
"default": function () { return "默认值" },
"readonly": function (row) { return false },
"calculate": function (row) { return row.fid + "-01" },
"required": {
"fn": function (row) { return true; },
"msg": "名称必填",
},
"constraint": {
"fn": function (row) { return row.name != "aa" },
"msg": "不能为aa",
}
}
},
"options": {
"limit": 4,
"className": "/main/product",
"autoMode": "",
"tableName": "product",
"restResource": "class",
"serviceName": "main",
"url": "/dbrest",
"idColumn": "fid"
},
}
let productData = new RestData(this, "productData", config);
productData.refreshData();
创建树形数据组件
例如：组织机构表的数据组件定义如下，其中 className 是 /main/product，tableName 是 product，restResource 是固定值 class
<wx:restData auto="load" className="/uaa/orgs" id="orgData" restResource="class" url="/dbrest" version="2.0.33"/>
使用 JS 代码动态创建“组织机构表”的数据组件，代码如下
let orgDataConfig = {
"defCols": {
"orgID": {
"label": "主键",
"type": "string"
},
"id": {
"label": "标识",
"type": "string"
},
"name": {
"label": "名称",
"type": "string"
},
"parentID": {
"label": "父节点",
"type": "string"
},
"fid": {
"label": "全路径标识",
"type": "string"
},
"fcode": {
"label": "全路径编码",
"type": "string"
}
},
"options": {
"limit": 999999,
"orderBy": [
{
"name": "sequence",
"type": 1
}
],
"className": "/uaa/orgs",
"autoMode": "",
"tableName": "orgs",
"restResource": "class",
"serviceName": "uaa",
"url": "/dbrest",
"treeOption": {
"isTree": true,
"parent": "parentID",
"leafCol": "leaf",
//"children": "_sys_children_",
"loadAll": false,
"fullId": "forgID",
"levelcol": "level"
},
"idColumn": "orgID"
}
}
let orgData = new RestData(this, "orgData", orgDataConfig);
orgData.refreshData();