amis/docs/zh-CN/components/amis.md
吴多益 28a90d94dd
feat: 新增 amis-render 组件, 用于渲染数据里的 amis 配置 (#7586)
* feat: 新增 amis-render 组件, 用于渲染数据里的 amis 配置

* type 改名为 amis

* 更新 snapshot

* 修复 snapshot 报错

* fix:input-table删除行记录动作问题

* feat: 范围类组件支持 extraName 拆成两个字段 (#7583)

* style: tr 的active 样式调整 close: #7585

* docs: 更新 React 官网链接

* docs: 添加 position 默认值示意 (#7592)

* chore:调用组件动作时找不到则throw Error

* feat: 新增 amis render 渲染组件

---------

Co-authored-by: lvxiaojiao <lvxiaojiao@baidu.com>
Co-authored-by: liaoxuezhi <2betop.cn@gmail.com>
Co-authored-by: liaoxuezhi <liaoxuezhi@icloud.com>
Co-authored-by: YangQi <yangfong2022@qq.com>
Co-authored-by: Allen <yupeng.fe@qq.com>
2023-08-01 10:13:24 +08:00

1.8 KiB
Raw Blame History

title description type group menuName icon order
AMIS 渲染器 0 ⚙ 组件 AMIS 渲染器 28

用于渲染数据中的 amis 配置

基本使用

只需要设置 schema 或 name值可以是 JSON 对象或字符串的 JSON

{
  "type": "amis",
  "schema": {
    "type": "tpl",
    "tpl": "amis render"
  }
}

通过 name 绑定动态数据

可以用在表单或 CRUD 中,下面示例演示了编辑后实时渲染的效果,因为使用了相同 的 name

{
    "type": "form",
    "api": "/api/mock2/form/saveForm",
    "title": "实时测试 amis 渲染效果",
    "body": [
        {
            "type": "group",
            "body": [
                {
                    "type": "editor",
                    "name": "amis",
                    "language": "json",
                    "value": {
                      "label": "弹框",
                      "type": "button",
                      "actionType": "dialog",
                      "dialog": {
                        "title": "弹框",
                        "body": "这是个简单的弹框。"
                      }
                    }
                },
                {
                    "type": "amis",
                    "name": "amis"
                }
            ]
        }

    ]
}

向下传递 props

通过设置 props 向下传递,这个 props 会作为默认值

{
  "type": "amis",
  "props": {
    "tpl": "amis render"
  },
  "value": {
    "type": "tpl"
  }
}

属性表

属性名 类型 默认值 说明
type string "amis" 指定为 amis 渲染器
name string 绑定上下文变量名
props object 向下传递的 props