Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
CoderSmallfan
uni-app
提交
4bcb0a76
U
uni-app
项目概览
CoderSmallfan
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
4bcb0a76
编写于
10月 26, 2020
作者:
W
wanganxp
提交者:
GitHub
10月 26, 2020
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Update schema.md
上级
782c00f1
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
254 addition
and
106 deletion
+254
-106
docs/uniCloud/schema.md
docs/uniCloud/schema.md
+254
-106
未找到文件。
docs/uniCloud/schema.md
浏览文件 @
4bcb0a76
# DB Schema
DB Schema是一种
基于 JSON 格式定义的数据结构的规范。
`DB Schema`
是
基于 JSON 格式定义的数据结构的规范。
*
描述现有的数据格式。
*
提供清晰的人类和机器可读文档,你可以一目了然的阅读每个表、每个字段的用途。
*
完整的结构验证,可用于验证客户端提交的数据及自动化测试。
*
可自动生成ui维护界面,比如新建页面和编辑页面,自动处理校验规则。(暂未上线)
它有很多重要的作用:
> MongoDB支持通过 [$jsonSchema 操作符](https://docs.mongodb.com/manual/reference/operator/query/jsonSchema/index.html)在插入和更新文档时进行结构验证(非空、类型校验等), $jsonSchema 支持 JSON Schema的草案4,包括[core specification](https://tools.ietf.org/html/draft-zyp-json-schema-04)和[validation specification](https://tools.ietf.org/html/draft-fge-json-schema-validation-00)。uniCloud在MongoDB基础上进行了JSON Schema扩展。
#### 如何体验
1.
登录 uniCloud控制台
[
https://unicloud.dcloud.net.cn
](
https://unicloud.dcloud.net.cn
)
2.
选择 “服务空间/创建服务空间”,然后在左侧栏选择 “云数据库”
3.
选择 已有表或新建表,点击表右侧页签 “表结构”
4.
点击 “编辑” 按钮,在编辑区域编写 Schema,编写完毕后记得点保存按钮。
!
[](
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/e237cb60-ff2d-11ea-8a36-ebb87efcf8c0.png
)
编写好schema后,您可以进一步导出表单校验规则。方法如下:
1.
点击 “导出表单校验规则”,在左侧选择要校验的字段,然后点击“下载zip”按钮,将导出一个工程源码压缩包,其中js_sdk目录下validator/validator/下的js文件。该文件包含了根据schema生成的校验规则。
!
[](
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/ba87a6b0-1519-11eb-81ea-f115fe74321c.png
)
A. 字段列表
-
描述现有的数据格式。可以一目了然的阅读每个表、每个字段的用途。
-
设定数据操作权限(permission)。什么样的角色可以读/写哪些数据,都在这里配置。
-
设定数据能接受的格式(validator),比如不能为空、需符合指定的正则格式。
-
设置数据的默认值(defaultValue/forceDefaultValue),比如服务器当前时间、当前用户id等。
-
设定多个表的字段间映射关系(foreignKey),将多个表按一个虚拟表直接查询,大幅简化联表查询。
-
根据schema自动生成表单维护界面,比如新建页面和编辑页面,自动处理校验规则。
B. 导出文件清单
C. 组件列表
> MongoDB支持通过 [$jsonSchema 操作符](https://docs.mongodb.com/manual/reference/operator/query/jsonSchema/index.html)在插入和更新文档时进行结构验证(非空、类型校验等), $jsonSchema 支持 JSON Schema的草案4,包括[core specification](https://tools.ietf.org/html/draft-zyp-json-schema-04)和[validation specification](https://tools.ietf.org/html/draft-fge-json-schema-validation-00)。uniCloud在MongoDB基础上进行了JSON Schema扩展。
D. 扩展校验函数,每个函数是一个文件
编写
`DB Schema`
是uniCloud的数据库开发的重要环节。但如果在云函数里操作数据库,
`DB Schema`
只能发挥描述作用,无法提供实际功能。通过
`clientDB`
在前端操作数据库才能发挥
`DB Schema`
的各种功能。
E. 验证规则,和表名一致
一般建议开发者在前端操作数据库,在云数据库里配好
`DB Schema`
,然后就不再编写服务器代码了。也就是传统开发中在服务器端写的各种代码,包括对数据格式的校验、权限的管控,全都通过schema设置,而不是写服务器代码。这种做法可以大幅提升开发效率、降低开发成本。
F. vue 页面,包含新增和修改
同时这要求开发者有一定的思路转换,需要一个角色站在数据库设计角度统筹所有规则。将原有的业务规则,都转换为数据库规则。
G. 文件预览 (仅支持预览 vue页面,校验规则)
#### 如何编写DB Schema
2.
解压导出的zip包,拷贝到已有工程(以后会支持直接导入到HBuilderX)
-
如果你已经自行编写过
`db-permission`
文件,注意不要把
`db-permission`
也覆盖了,如果您未编写过
`db-permission`
,可以覆盖过去,并打开该文件根据自己的需求进行修改。
1.
登录
[
uniCloud控制台
](
https://unicloud.dcloud.net.cn
)
,选中一个数据表
2.
点击表右侧页签 “表结构”,点击 “编辑” 按钮,在编辑区域编写 Schema,编写完毕后点保存按钮即可生效。
!
[](
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/e237cb60-ff2d-11ea-8a36-ebb87efcf8c0.png
)
注意数据校验,只有使用clientDB 2.0+,才有效。不用clientDB,在云函数中直接操作数据库无法使用该校验规则
。
`DB Schema`
在保存后是实时生效的,请注意对现网商用项目的影响
。
###
#
Schema字段@segment
### Schema字段@segment
|属性|类型|描述|
|:-|:-|:-|
|required|array|必填的下级字段名称。required可以在表级的描述出现,约定该表有哪些字段必填。也可以在某个字段中出现,如果该字段是一个json,可以对这个json中的哪些字段必填进行描述。详见下方示例|
|bsonType|any|字段类型,如json object、字符串、bool值,具体见下表bsonType可用类型|
|bsonType|any|字段类型,如json object、字符串、数字、bool值,具体见下表bsonType可用类型|
|title|string|标题,开发者维护时自用。如果不填label属性,将在生成前端表单代码时,默认用于表单项前面的label|
|description|string|描述,开发者维护时自用。在生成前端表单代码时,如果字段未设置component,且字段被渲染为input,那么input的placehold将默认为本描述|
|required|array|是否必填。支持填写必填的下级字段名称。required可以在表级的描述出现,约定该表有哪些字段必填。也可以在某个字段中出现,如果该字段是一个json,可以对这个json中的哪些字段必填进行描述。详见下方示例|
|enum|Array|字段值枚举范围,数组中至少要有一个元素,且数组内的每一个元素都是唯一的。|
|maximum|number|如果bsonType为数字时,可接受的最大值|
|exclusiveMaximum|boolean|是否排除 maximum|
...
...
@@ -55,46 +42,43 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
|exclusiveMinimum|boolean|是否排除 minimum|
|minLength|number|最小长度|
|maxLength|number|最大长度|
|title|string|标题,开发者维护时自用|
|description|string|描述,开发者维护时自用|
|format|'url'
|
'email'|数据格式|
|pattern|String|正则表达式,如设置为手机号的正则表达式后,不符合该正则表达式则校验失败|
|format|'url'
|
'email'|数据格式,不符合格式的数据无法入库。目前只支持'url'和'email',未来会扩展其他格式|
|pattern|String|正则表达式,如设置为手机号的正则表达式后,不符合该正则表达式则校验失败,无法入库|
|validateFunction|string|扩展校验函数名|
|permission|Object|数据库权限,参考:
[
https://uniapp.dcloud.net.cn/uniCloud/uni-clientDB?id=db-permission
](
https://uniapp.dcloud.net.cn/uniCloud/uni-clientDB?id=db-permission
)
|
|foreignKey|String|关联字段,形如
`表名.字段名`
|
|label|string|字段标题。用于生成数据维护ui界面时,渲染表单项前面的label标题|
|errorMessage|string
|
Object |当数据写入或更新时,校验数据合法性失败后,返回的错误提示|
|defaultValue|string
|
Object|默认值|
|forceDefaultValue|string
|
Object|强制默认值,不可通过clientDB的代码修改,常用于存放用户id、时间、客户端ip等固定值。具体参考下表的defaultValue|
|errorMessage|string
|
Object |当数据写入或更新时,校验数据合法性失败后,返回的错误提示|
|group|string|分组id。生成数据维护ui界面时,多个字段对应的表单项可以合并显示在一个uni-group组件中|
|order|int|表单项排序序号。生成数据维护ui界面时,该字段对应的表单项所处排序位置的序号。如果被包含在uni-group中,按同组排序|
|component|Object
|
Array|生成数据维护ui界面时,使用什么组件渲染这个表单项。比如使用input输入框。详见下方示例|
|foreignKey|String|关联字段。即该字段指向某个表的某个字段,值的格式为
`表名.字段名`
,比如订单表的uid字段指向uni-id-users表的_id字段。关联字段定义后可用于
[
联表查询
](
https://uniapp.dcloud.net.cn/uniCloud/database?id=lookup
)
|
|permission|Object|数据库权限,控制什么角色可以对什么数据进行读/写,可控制表和字段,可设置where条件|
|label|string|字段标题。生成前端表单代码时,渲染表单项前面的label标题|
|group|string|分组id。生成前端表单代码时,多个字段对应的表单项可以合并显示在一个uni-group组件中|
|order|int|表单项排序序号。生成前端表单代码时,默认是以schema中的字段顺序从上到下排布表单项的,但如果指定了order,则按order规定的顺序进行排序。如果表单项被包含在uni-group中,则同组内按order排序|
|component|Object
|
Array|生成前端表单代码时,使用什么组件渲染这个表单项。比如使用input输入框。详见下方示例|
**注意:**
1.
`DB Schema`
的各种功能均只支持
`clientDB`
。如果使用云函数操作数据库,schema的作用仅仅是描述字段信息。同时强烈推荐使用HBuilderX 2.9.5以上版本使用
`clientDB`
。
2.
字段属性
`permission`
, 仅支持 ".read", ".write"
3.
生成表单页面的功能,入口在uniCloud web控制台的数据库schema界面,注意该功能需搭配HBuilderX 2.9.5+版本。
4.
暂不支持子属性校验
2.
生成表单页面的功能,入口在uniCloud web控制台的数据库schema界面,注意该功能需搭配HBuilderX 2.9.5+版本。
3.
暂不支持子属性校验
### bsonType可用类型
|类型 |长度 |名称 |
|:- |:- |:- |
|Double |1 |“double” |
|String |2 |“string” |
|Double |1 |“double” |
|32-bit integer |16 |“int” |
|Object |3 |“object” |
|Array |4 |“array” |
|Boolean |8 |“bool” |
|32-bit integer |16 |“int” |
|Timestamp |17 |“timestamp” |
**注意:在schema描述中需要使用上述表格中的“名称”,而不是“类型”
。
**
**注意:在schema描述中需要使用上述表格中的“名称”,而不是“类型”**
### 示例
假使一个表有5个字段:"name", "year", "major", "address", "gpa"。其中前4个字段是必填字段,然后"address"字段类型为json object,下面又有若干子字段,其中"city"字段必填。
假使一个表有5个字段:"name", "year", "major", "address", "gpa"。其中前4个字段是必填字段,然后"address"字段类型为json object,
它
下面又有若干子字段,其中"city"字段必填。
则schema按如下编写。
...
...
@@ -139,44 +123,16 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
### permission属性
数据库权限示例
```
json
{
"bsonType"
:
"object"
,
"required"
:
[],
"permission"
:
{
".read"
:
true
,
//
任何用户都可以读
".create"
:
false
,
//
禁止新增数据记录(admin权限用户不受限)
".update"
:
false
,
//
禁止更新数据(admin权限用户不受限)
".delete"
:
false
//
禁止删除数据(admin权限用户不受限)
},
"properties"
:
{
...
"name"
:
{
"bsonType"
:
"string"
,
"label"
:
"姓名"
,
"permission"
:
{
".read"
:
false
,
//
禁止读取
name
字段的数据(admin权限用户不受限)
".write"
:
false
//
禁止写入
name
字段的数据(admin权限用户不受限)
}
...
}
}
}
```
### defaultValue/forceDefaultValue
-
defaultValue指定新增时当前字段默认值,客户端可以修改此值。
-
forceDefaultValue也是指定新增时当前字段的默认值,与defaultValue不一样,forceDefaultValue不可被客户端修改。
在实际开发中,forceDefaultValue设置为当前时间、用户id、客户端ip时,可以少些很多代码,clientDB在新增数据记录时会自动补齐这些数据。这些数据都不能通过客户端上传,不安全,只能在云端写入。
在实际开发中,forceDefaultValue常用于设置为当前服务器时间、当前登录用户id、客户端ip时。
这些数据都不能通过前端上传,不安全,过去只能在云端写云函数操作。在schema配置后则可以不用写云函数。
`clientDB`
在新增数据记录时会自动补齐这些数据。
其中uid是和
uni-id绑定的。如果用户没有登录,会报错
,无法写入数据。
其中uid是和
`uni-id`
绑定的。如果用户没有登录,则无法获取uid
,无法写入数据。
示例:
...
...
@@ -184,7 +140,7 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
//
指定默认值为
true
"defaultValue"
:
true
//
指定强制默认值为当前时间戳
//
指定强制默认值为当前
服务器
时间戳
"forceDefaultValue"
:
{
"$env"
:
"now"
}
...
...
@@ -201,7 +157,7 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
默认值
`"defaultValue": ...`
,指定默认值为当前时间戳。新增记录时,若
clientDB不传该字段,则默认为当前时间。若clientDB传一个不同
的值,则以传的值为准。
默认值
`"defaultValue": ...`
,指定默认值为当前时间戳。新增记录时,若
前端不传该字段,则默认为当前时间。若前端传一个指定
的值,则以传的值为准。
```
json
{
...
...
@@ -220,7 +176,7 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
强制默认值,覆盖默认值
`"forceDefaultValue": ...`
,指定默认值为当前时间戳。此时
clientDB
传任何值均无效,新增记录时一定会变成当前时间。
强制默认值,覆盖默认值
`"forceDefaultValue": ...`
,指定默认值为当前时间戳。此时
前端
传任何值均无效,新增记录时一定会变成当前时间。
```
json
{
...
...
@@ -239,11 +195,18 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
### 校验规则@validator
### 数据校验系统validator@validator
与数据校验相关的配置,不符合配置的数据无法入库。
`DB Schema`
里的校验系统由3部分组成。
1.
各种属性配置:是否必填(required)、数据类型(bsonType)、数字范围(maximum、minimum)、字符串长度范围(minLength、maxLength)、format、pattern正则表达式
2.
扩展校验函数:validateFunction。当属性配置不满足需求,需要写js函数进行校验时,使用本功能
3.
错误提示:errorMessage。常见错误有默认的错误提示语。开发者也可以自定义错误提示语
与数据校验相关的配置如下:
#### 各种校验属性配置
必填字段,
`"required": ["name"]`
-
必填字段,
`"required": ["name"]`
```
json
{
...
...
@@ -281,7 +244,7 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
类型
`"bsonType": "string"`
-
类型
`"bsonType": "string"`
```
json
{
...
...
@@ -298,7 +261,7 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
格式
`"format": "email"`
-
格式
`"format": "email"`
```
json
{
...
...
@@ -319,7 +282,7 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
正则
`"pattern": ""`
-
正则
`"pattern": ""`
例如: 验证手机号
`"pattern": "^\\+?[0-9-]{3,20}$"`
...
...
@@ -343,16 +306,19 @@ DB Schema是一种基于 JSON 格式定义的数据结构的规范。
```
###
validateFunction属性
@validateFunction
###
# validateFunction扩展校验函数
@validateFunction
扩展校验函数
当属性配置不满足需求,需要写js函数进行校验时,使用本功能。
如何使用
1.
uniCloud 控制台,选择服务空间,切换到数据表
2.
底部 “扩展校验函数” 点击 “+” 增加校验函数 !
[](
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/2f4d0230-12a2-11eb-b244-a9f5e5565f30.png
)
给函数起个名字,比如叫“checkabc”,然后写具体的js代码,如下
```
// 扩展校验函数示例
...
...
@@ -367,7 +333,7 @@ exports = function (rule, value, data, callback) {
}
```
3.
在表结构 schema 编辑页面中
配置需要校验的函数名称
3.
在表结构 schema 编辑页面中
的
`validateFunction`
属性中配置上面编写的 扩展校验函数 的名称。
```
json
{
...
...
@@ -377,7 +343,7 @@ exports = function (rule, value, data, callback) {
"name"
:
{
"bsonType"
:
"string"
,
"label"
:
"姓名"
,
"validateFunction"
:
"
name
"
,
"validateFunction"
:
"
checkabc
"
,
"errorMessage"
:
{
"required"
:
"{label}不能为空"
,
"pattern"
:
"{label}格式无效"
...
...
@@ -390,10 +356,9 @@ exports = function (rule, value, data, callback) {
4.
保存后生效
#### errorMessage自定义错误提示
### errorMessage属性
clientDB的validator校验库,会根据schema配置的规范进行校验。数据不符合要求时,无法入库,此时会根据errorMessage的定义报出错误提示。
数据不符合schema配置的规范时,无法入库,此时会根据errorMessage的定义报出错误提示。
errorMessage支持字符串,也支持json object。类型为object时,可定义多个校验提示。
...
...
@@ -434,14 +399,196 @@ errorMessage支持字符串,也支持json object。类型为object时,可定
}
```
从示例可以看出,errorMessage支持配一条,也支持根据不同的错误类型配不同的errorMessage。
-
每个校验相关的属性不通过,可以以属性名为key配置它的错误提示语。
-
如果是扩展校验函数,可以在其内部写callback来自定义错误提示语。
### 数据权限系统permission@permission
uniCloud数据库的权限系统是按如下方式运转的:
1.
首先项目需使用
[
uni-id
](
/uniCloud/uni-id
)
,并按uni-id配置用户的角色,admin管理员、游客、用户自己无需配置。详见
[
uni-id的角色权限
](
/uniCloud/uni-id?id=rbac
)
2.
在
`DB Schema`
中配置数据权限,指定什么数据允许什么角色读写。
`DB Schema`
的permission规则,可以对整个表的增删改查进行控制,也可以针对字段进行控制;可以简单的配置true/false,也可以配置更具体的规则
比如permission内规定doc.a > 1,那么查询条件里面就必须有a且条件内的a也满足a>1,在前端发起这样的查询
`a==2`
、
`a>3`
都是满足条件的查询。
**权限规则内可以使用的全局变量**
|变量名 |说明 |
|:-: |:-: |
|auth.uid |用户id |
|auth.role |用户角色数组,参考
[
uni-id 角色权限
](
/uniCloud/uni-id?id=rbac
)
,注意
`admin`
为clientDB内置的角色,如果用户角色列表里包含
`admin`
则认为此用户有完全数据访问权限|
|auth.permission|用户权限数组,参考
[
uni-id 角色权限
](
/uniCloud/uni-id?id=rbac
)
|
|doc |记录内容,用于匹配记录内容/查询条件(需要注意的是,规则内的doc对象并不是直接去校验存在于数据库的数据,而是校验客户端的查询条件) |
|now |当前时间戳(单位:毫秒),时间戳可以进行额外运算,如doc.publish
\_
date > now - 60000表示publish
\_
date在最近一分钟 |
|action |当前客户端指定的action |
permission为对数据的操作权限,如果要封装业务权限,可以在uni-id的业务权限表里进行配置。业务权限进一步可组装为角色。然后每个具体的uni-id用户可以被赋予某个角色。
如果在uni-id里定义了业务权限和角色,也可以在permission中通过auth.permission和auth.role来使用,以实现更灵活的配置定义。
**权限规则内可以使用的运算符**
|运算符 |说明 |示例 |示例解释(集合查询) |
|:-: |:-: |:-: |:-: |
|== |等于 |auth.uid == 'abc' |用户id为abc |
|!= |不等于 |auth.uid != 'abc' |用户id不为abc |
|> |大于 |doc.age>10 |查询条件的 age 属性大于 10 |
|>= |大于等于 |doc.age>=10 |查询条件的 age 属性大于等于 10 |
|< |小于 |doc.age<10 |查询条件的 age 属性小于 10 |
|<= |小于等于 |doc.age<=10 |查询条件的 age 属性小于等于 10 |
|in |存在在数组中 |doc.status in ['a','b'] |查询条件的 status 是['a','b']中的一个,数组中所有元素类型需一致 |
|! |非
`2.0.5+`
|!(doc.status in ['a','b']) |查询条件的 status 不是['a','b']中的任何一个,数组中所有元素类型需一致|
|&& |与 |auth.uid == 'abc' && doc.age>10 |用户id 为 abc 并且查询条件的 age 属性大于 10 |
|
||
|或 |auth.uid == 'abc'
||
doc.age>10|用户Id为abc或者查询条件的 age 属性大于 10 |
**权限规则内可以使用的方法**
权限规则内仅可使用get方法,作用是根据id获取数据库中的数据。get方法接收一个字符串作为参数字符串形式为
`database.表名.记录ID`
用法示例:
```
js
"
get(`database.shop.${doc.shop_id}`).owner == auth.uid
"
```
使用get方法时需要注意get方法的参数必须是唯一确定值,以上述示例为例
```
js
// 可以使用的查询条件,此条件内doc.shop_id只能是'123123'
db
.
collection
(
'
street
'
).
where
(
"
shop_id=='123123'
"
).
get
()
// 不可使用的查询条件,此条件内doc.shop_id可能是'123123'也可能是'456456'
const
dbCmd
=
db
.
command
db
.
collection
(
'
street
'
).
where
(
"
shop_id=='123123 || shop_id=='456456'
"
).
get
()
```
数据库权限示例
```
json
{
"bsonType"
:
"object"
,
"required"
:
[],
"permission"
:
{
".read"
:
true
,
//
任何用户都可以读
".create"
:
false
,
//
禁止新增数据记录(admin权限用户不受限)
".update"
:
false
,
//
禁止更新数据(admin权限用户不受限)
".delete"
:
false
//
禁止删除数据(admin权限用户不受限)
},
"properties"
:
{
...
"name"
:
{
"bsonType"
:
"string"
,
"label"
:
"姓名"
,
"permission"
:
{
".read"
:
false
,
//
禁止读取
name
字段的数据(admin权限用户不受限)
".write"
:
false
//
禁止写入
name
字段的数据(admin权限用户不受限)
}
...
}
}
}
```
'.read': 'doc.uid == auth.uid', // 每个用户只能读取用户自己的数据。前提是要操作的数据doc,里面有一个字段存放了uid,即uni-id的用户id。
'.read': 'doc.status == "OnSell"' // 所有人均可读取字段status="ObSell"的数据
### 前端表单生成系统@autocode
`DB Schema`
里有大量的信息,有了这些信息,前端将无需自己开发表单维护界面,uniCloud可以自动生成新增数据、修改数据的表单页面。
为强化表单的自定义性,
`DB Schema`
还扩展了label、component、group、order等属性。
前端表单生成系统功能包括:
-
自动生成新增、修改表单的页面文件,分别是add.vue和edit.vue
-
自动生成前端表单校验规则
表单校验工作,在前端和后端都需要做。在过去,这造成重复投入。
现在,前后端的表单验证都被统一了。
开发者修改
`DB Schema`
并保存后,云端的校验规则直接生效。
### component属性
然后开发者需要把这套校验规则导入到前端项目中。即利用本功能。
该字段在表单中使用什么样的组件进行渲染,可设置组件名和初始属性。
DCloud提供了
`uni-forms`
前端组件,该组件的校验规范完全符合
`DB Schema`
中的校验规则,实现云端统一。
`uni-forms`
组件地址:
[
https://ext.dcloud.net.cn/plugin?id=2773
](
https://ext.dcloud.net.cn/plugin?id=2773
)
1.
在schema界面点击 “导出表单页面”
!
[](
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/ba87a6b0-1519-11eb-81ea-f115fe74321c.png
)
上图每个区域的解释如下:
-
区域A. 字段列表
这里需要选择在前端表单页面出现的字段,无需用户在表单页面提交的字段(如create_date)不应勾选。
选择字段后,右侧会变化,自动生成代码。
-
区域B. 导出文件清单
这里显示了完整的工程结构。点击右下角的“下载zip”可以把这个工程下载到本地。点击这里的每个文件,在右侧会出现文件相应的代码。
只有自动生成的文件会在右侧显示代码,components目录下的三方库不会在右侧显示代码。
-
区域C. 组件列表
根据
`DB Schema`
生成的表单页面,是基于
`uni-forms`
组件的,该组件地址:
[
https://ext.dcloud.net.cn/plugin?id=2773
](
https://ext.dcloud.net.cn/plugin?id=2773
)
-
区域D. 扩展校验函数,每个函数是一个文件
-
区域E. 表单校验规则,和表名一致,每个表一个文件
在修改schema中的校验规则后,云端是直接生效的。前端部分则需要下载这个js文件到本地工程。
如果直接已经下载过,需要二次更新,也可以在右侧复制源码,增量添加到前端工程的校验规则中。
-
区域F. 新建和编辑页面
自动生成的表单页面,包括新建页面和编辑页面。这些页面均基于clientDB,可直接使用。
-
区域G. 文件预览 (仅支持预览 自动生成的页面和校验规则)
2.
然后点击“下载zip”按钮,将导出一个工程源码压缩包。解压导出的zip包,拷贝到已有工程
**注意:生成的代码,需HBuilderX2.9.5+方可正常运行。**
#### 生成页面控件的默认策略
`DB Schema`
配置的字段,在生成页面时使用什么组件渲染?决定关系如下:
-
如果配置了字段的component属性,则严格按component的配置执行。
-
如果没有配置component属性,那么默认有如下策略:
*
字段类型为bool时,默认使用switch组件
*
其他字段类型,将生成input组件。如果是数字类型,会同时把input的键盘类型设为数字。
-
如果没有配label,则以title作为label,渲染在表单项前面
-
description在渲染为input时会被设为placehold
<!--
如果是时间戳,则需要新做一个时间选择组件
如果有枚举,默认为picker
如果是number且有大小范围,默认用步进器
-->
#### label属性
在
[
`uni-forms组件
](
https://ext.dcloud.net.cn/plugin?id=2773
)
中,每个表单项都被包裹在
`uni-forms-item`
中,该子组件可设置label,即,在表单项如输入框前面或上面放置一个说明性名词。
在
`DB Schema`
的label属性中设置值后,生成前端表单页面时即可自动给
`uni-forms-item`
的label属性赋值。
如果未设置label属性,但配置了title属性,生成前端表单页面时会取title作为前端的label。
#### component属性
定义该字段在表单中使用什么样的组件进行渲染,可设置前端的组件名和初始属性。
这里的表单,指的是数据维护表单,比如新建记录或修改记录的表单。
生成的所有表单项,都在
uni-form组件
下。
生成的所有表单项,都在
[
uni-forms组件
](
https://ext.dcloud.net.cn/plugin?id=2773
)
下。
|属性|类型|描述|
|:-|:-|:-|
...
...
@@ -599,11 +746,12 @@ component 类型为数组
```
### group属性
###
#
group属性
将多个表单项合并在一个分组里显示。前端渲染时,group相
关的自动会
合并在一个uni-group组件中,不同分组的表单项之间有间隔。该组件详见:
[
https://ext.dcloud.net.cn/plugin?id=3281
](
https://ext.dcloud.net.cn/plugin?id=3281
)
将多个表单项合并在一个分组里显示。前端渲染时,group相
同的表单项会自动
合并在一个uni-group组件中,不同分组的表单项之间有间隔。该组件详见:
[
https://ext.dcloud.net.cn/plugin?id=3281
](
https://ext.dcloud.net.cn/plugin?id=3281
)
示例
```
json
{
"bsonType"
:
"object"
,
...
...
@@ -660,6 +808,6 @@ component 类型为数组
<uni-forms-item label="姓名"><input placeholder="请输入姓名" class="input" :hidden="false" :readonly="false" :disabled="false" /></uni-forms-item>
<uni-forms-item label="年龄"><input placeholder="请输入年龄" /></uni-forms-item>
</uni-group>
...
```
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录