baidu / amis

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

input-text组件使用autoComplete属性时 点击了选项 选项组弹框不消失 需要点击空白处才能消失 #8173

Open Liary0 opened 1 year ago

Liary0 commented 1 year ago

描述问题:

input-text组件使用autoComplete属性时 点击了选项 选项组弹框不消失 需要点击空白处才能消失

截图或视频:

b8f75afe866e9f0bc3b56f321255077

如何复现(请务必完整填写下面内容):

  1. 你是如何使用 amis 的? sdk

  2. amis 版本是什么?请先在最新 beta 版本测试问题是否存在 https://img.7ugame.cn/amis/sdk.js

  3. 粘贴有问题的完整 amis schema 代码:

    {
                            "type": "input-text",
                            "name": "label",
                            "label": "游戏名称",
                            "required": true,
                            "autoComplete": "post:/admin/game/searchGame",
                            "autoFill": {
                                "FDeviceCode": "${FDeviceCode}",
                                "FRelationCode": "${FGameCode}"
                            },
                            "visibleOn": "${FRelationType == 2}"
                        },
  4. 操作步骤 请简单描述一下复现的操作步骤...

lhtuling commented 1 month ago

我大概找到问题所在,也本地测试修复了, 但是不知道有没有其他影响,代码应该也不算太规范,但是解决这个问题了 修改这个文件 packages\amis\src\renderers\Form\InputText.tsx 里面的


  async handleClick(event: React.MouseEvent) {
    const {dispatchEvent, value, multiple} = this.props;
    const rendererEvent = await dispatchEvent(
      'click',
      resolveEventData(this.props, {
        value
      })
    );

    if (rendererEvent?.prevented) {
      return;
    }
    // 已经 focus 的就不重复执行,否则总重新定位光标
    this.state.isFocused || this.focus();
    if(multiple ||(event.target as HTMLElement).tagName.toLowerCase() === 'input'){
      this.setState({
        isOpen: true
      });
    }
  }

整个替换掉就行了

提交个pr看看能过不能 https://github.com/baidu/amis/pull/10972