baidu / amis

前端低代码框架,通过 JSON 配置就能生成各种页面。
https://baidu.github.io/amis/
Apache License 2.0
17.26k stars 2.51k forks source link

表单项api接口返回的数据其它地方是不是没法直接访问?要套一层服务service? #10068

Open LAMMUpro opened 6 months ago

LAMMUpro commented 6 months ago

实现场景:

表单项A的自定义JS事件先访问表单项B(列表选择)的选项数据(外部接口返回的),这种需求是不是要套一层服务service才能实现?

存在的问题:

1713491272866

当前方案:

请粘贴你当前方案的完整 amis schema 代码...

{
  "type": "dialog",
  "id": "u:d713cad18a57",
  "body": [
    {
      "type": "form",
      "id": "u:41eeeda2bd98",
      "title": "表单",
      "mode": "horizontal",
      "dsType": "api",
      "feat": "Insert",
      "body": [
        {
          "type": "container",
          "body": [
            {
              "type": "service",
              "id": "u:50f1dd4d4cfa",
              "onEvent": {
                "fetchInited": {
                  "weight": 0,
                  "actions": [
                    {
                      "ignoreError": false,
                      "script": "/* 自定义JS使用说明:\n  * 1.动作执行函数doAction,可以执行所有类型的动作\n  * 2.通过上下文对象context可以获取当前组件实例,例如context.props可以获取该组件相关属性\n  * 3.事件对象event,在doAction之后执行event.stopPropagation();可以阻止后续动作执行\n*/\nconsole.log('.....items', context.props.data.items);\nconst item = context.props.data.items.find(item => item.version === store.currentApplicationVersion);\ndoAction({\n  actionType: 'updateValue',\n  componentId: \"u:ee05895bb14b\",\n  args: {\n    /** 当前选中的versionId */\n    value: item?.id\n  },\n  item,\n});\n",
                      "actionType": "custom",
                      "args": {}
                    }
                  ]
                }
              },
              "body": [
                {
                  "type": "select",
                  "label": "应用版本",
                  "name": "appVersionId",
                  "id": "u:ee05895bb14b",
                  "multiple": false,
                  "placeholder": "请选择应用版本",
                  "source": "${items}",
                  "labelField": "version",
                  "valueField": "id",
                  "className": "",
                  "onEvent": {
                    "change": {
                      "weight": 0,
                      "actions": [
                        {
                          "ignoreError": false,
                          "actionType": "custom",
                          "args": {},
                          "script": "/** 更新表单version值 */\ndoAction({\n  actionType: 'setValue',\n  componentName: \"form\",\n  args: {\n    value: {\n      version: event.data.selectedItems.version,\n    }\n  }\n});\n/** 回显绑定环境选项 */\n"
                        }
                      ]
                    }
                  },
                  "required": true,
                  "size": "lg"
                }
              ],
              "dsType": "api",
              "api": {
                "url": "/api/app-version?applicationId=${store.currentEditAppId}",
                "method": "get",
                "requestAdaptor": "",
                "adaptor": "",
                "messages": {}
              }
            }
          ],
          "id": "u:c31606f551b0",
          "style": {
            "position": "relative",
            "display": "flex",
            "inset": "auto",
            "flexWrap": "nowrap",
            "flexDirection": "column",
            "alignItems": "flex-start"
          },
          "size": "none",
          "wrapperBody": false,
          "isFixedHeight": false,
          "isFixedWidth": false,
          "themeCss": {
            "baseControlClassName": {
              "padding-and-margin:default": {
                "marginBottom": "20px"
              }
            }
          }
        },
        {
          "type": "list-select",
          "label": "绑定环境",
          "name": "envIdListStr",
          "id": "u:73f321895e3b",
          "multiple": true,
          "inline": false,
          "mode": "horizontal",
          "source": {
            "url": "/api/app-env?applicationId=${store.currentEditAppId}",
            "method": "get",
            "requestAdaptor": "",
            "adaptor": "",
            "messages": {},
            "responseData": {
              "options": "${items}"
            }
          },
          "labelField": "envCh",
          "valueField": "id",
          "disabled": false,
          "required": true,
          "validateOnChange": false
        }
      ],
      "actions": [
        {
          "type": "submit",
          "label": "提交",
          "primary": true
        }
      ],
      "name": "form",
      "data": {
        "version": ""
      },
      "rules": []
    }
  ],
  "definitions": {},
  "title": "应用环境设置",
  "showCloseButton": true,
  "showErrorMsg": true,
  "showLoading": true,
  "className": "app-popover",
  "actions": [
    {
      "type": "button",
      "actionType": "cancel",
      "label": "取消",
      "id": "u:e1c39d79c761",
      "onEvent": {
        "click": {
          "weight": 0,
          "actions": [
            {
              "ignoreError": false,
              "actionType": "closeDialog"
            }
          ]
        }
      }
    },
    {
      "type": "button",
      "actionType": "confirm",
      "label": "确认",
      "primary": true,
      "id": "u:810060dd97e8"
    }
  ],
  "closeOnOutside": false,
  "closeOnEsc": false,
  "themeCss": {
    "dialogClassName": {
      "box-shadow": " 0px 0px 0px 0px transparent"
    }
  },
  "onEvent": {
    "cancel": {
      "weight": 0,
      "actions": [
        {
          "ignoreError": false,
          "actionType": "closeDialog"
        }
      ]
    }
  },
  "draggable": false,
  "actionType": "dialog"
}
github-actions[bot] commented 6 months ago

👍 Thanks for this! 🏷 I have applied any labels matching special text in your issue.

Please review the labels and make any necessary changes.