amis2/docs/types/definitions.md

112 lines
2.7 KiB
Markdown
Raw Normal View History

2020-07-28 10:03:53 +08:00
---
title: Definitions
2020-11-16 18:50:38 +08:00
description:
2020-07-28 10:03:53 +08:00
type: 0
group: ⚙ 组件
menuName: Definitions
2020-11-16 18:50:38 +08:00
icon:
2020-07-28 10:03:53 +08:00
order: 40
---
2020-11-16 18:50:38 +08:00
`Definitions`建立当前页面公共的配置项,在其他组件中可以通过`$ref`来引用当前配置项中的内容。
> 注意 definitions 只能在顶级节点中定义。
2020-07-28 10:03:53 +08:00
```schema:height="300"
{
"definitions": {
"aa": {
"type": "text",
"name": "jack",
2019-06-21 18:04:28 +08:00
"value": "ref value",
2019-07-15 23:42:22 +08:00
"labelRemark": "通过<code>\\$ref</code>引入的组件"
}
},
"type": "page",
"title": "引用",
"body": [
{
"type": "form",
"api": "api/xxx",
"actions": [],
"controls": [
{
2019-07-15 23:42:22 +08:00
"$ref": "aa"
}
]
2019-07-15 23:42:22 +08:00
}
]
}
```
2020-11-16 18:50:38 +08:00
## 树形结构
`Definitions` 最大的作用其实是能够实现对数据格式的递归引用,实现无限层级编辑:
2019-07-15 23:42:22 +08:00
2020-11-16 18:50:38 +08:00
```schema:height="800"
2019-07-15 23:42:22 +08:00
{
"definitions": {
"options": {
"type": "combo",
"multiple": true,
"multiLine": true,
"name": "options",
"controls": [
{
"type": "group",
"controls": [
{
"label": "名称",
"name": "label",
"type": "text",
"required": true
},
{
"label": "值",
"name": "value",
"type": "text",
"required": true
}
]
},
{
"label": "包含子选项",
"type": "switch",
"name": "hasChildren",
"mode": "inline",
"className": "block"
},
{
"$ref": "options",
"label": "子选项",
"name": "children",
"visibleOn": "this.hasOwnProperty('hasChildren') && this.hasChildren",
"addButtonText": "新增子选项"
}
]
}
},
"type": "page",
"title": "引用",
"body": [
{
"type": "form",
"api": "api/xxx",
"actions": [],
"controls": [
{
2019-07-15 23:42:22 +08:00
"$ref": "options",
"label": "选项"
},
2019-07-15 23:42:22 +08:00
{
2019-07-15 23:42:22 +08:00
"type": "static",
"label": "当前值",
"tpl": "<pre>${options|json}</pre>"
}
]
}
]
}
2020-07-28 10:03:53 +08:00
```