baidu / amis

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

confirmText弹出的确认框希望通过Enter键快速确认 #11177

Open xiahao90 opened 1 week ago

xiahao90 commented 1 week ago

是否关联于某个问题吗:

confirmText弹出的确认框希望通过Enter键快速确认,有时候需要删除多条的时候可以鼠标与Enter键快速配合

预期的解决方案:

请简单描述你想达到的效果...

其他可接受方案:

请简单描述其他你可以接受的效果...

任何附加信息:

请添加任何可以补充说明上述问题的材料,例如图片或视频等...

lhtuling commented 2 days ago

原理: 给确定按钮增加className 用自定义js 选中确定按钮 设置焦点

{
  "type": "page",
  "body": [
    {
      "type": "button",
      "label": "按钮",
      "onEvent": {
        "click": {
          "actions": [
            {
              "ignoreError": false,
              "actionType": "dialog",
              "waitForAction": true,
              "outputVar": "aaa",
              "dialog": {
                "type": "dialog",
                "title": "未命名弹窗",
                "body": [
                  {
                    "type": "service",
                    "body": [],
                    "id": "u:76dfc6a326ae",
                    "dsType": "api",
                    "onEvent": {
                      "init": {
                        "weight": 0,
                        "actions": [
                          {
                            "ignoreError": false,
                            "script": "document.querySelector(\".autoActive\").focus();",
                            "actionType": "custom"
                          }
                        ]
                      }
                    }
                  }
                ],
                "id": "u:6ab4971bc0b9",
                "actions": [
                  {
                    "type": "button",
                    "actionType": "cancel",
                    "label": "取消",
                    "id": "u:b5f3a3321fb8"
                  },
                  {
                    "type": "button",
                    "actionType": "confirm",
                    "label": "确定",
                    "primary": true,
                    "id": "u:690b52e2e2b4",
                    "className": "autoActive"
                  }
                ],
                "actionType": "dialog",
                "showCloseButton": true,
                "closeOnOutside": false,
                "closeOnEsc": true,
                "showErrorMsg": true,
                "showLoading": true,
                "draggable": false,
                "hideActions": false
              }
            }
          ]
        }
      },
      "id": "u:1a3afef8b2da"
    }
  ],
  "title": "增删改查示例",
  "remark": "bla bla bla",
  "toolbar": [],
  "id": "u:ec9bce0af136",
  "asideResizor": false,
  "pullRefresh": {
    "disabled": true
  },
  "data": {
    "test": "1111"
  },
  "aside": [],
  "definitions": {}
}

Amis低代码前端框架交流群【QQ1群】:717791727 Amis低代码前端框架交流群【QQ2群】:721182449