Skip to content

🐛[BUG]点击 ProFormUploadButton 和 ProFormUploadDragger 的label,不应该弹出文件选择器 #9298

@yao-yh

Description

@yao-yh

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

🐛 bug 描述

测试发现 ProFormUploadButton ProFormUploadDragger 的label,会弹出文件选择器。

📷 复现步骤

官方文档的demo就可以复现。点击同种的 "上传" 和 "拖拽上传" 就可以触发 打开文件选择器

Image

🏞 期望结果

这个似乎是antd的Form.item的默认功能
当点击 Form.item 的label,会触发input组建的focus。
但是对于upload组件来说这个交互应该是不合理的。有类似问题的还有switch组件(点击时,switch会切换)

关于这个问题 antd 的文档里,有解决的示例
Image

<Form.Item label="Dragger">
  <Form.Item name="dragger" valuePropName="fileList" getValueFromEvent={normFile} noStyle>
    <Upload.Dragger name="files" action="/upload.do">
      <p className="ant-upload-drag-icon">
        <InboxOutlined />
      </p>
      <p className="ant-upload-text">Click or drag file to this area to upload</p>
      <p className="ant-upload-hint">Support for a single or bulk upload.</p>
    </Upload.Dragger>
  </Form.Item>
</Form.Item>

查看了相关源码,是否可以在这里加上一个参数。当使用 Upload 等组件的时候,按照上述文档多渲染一层Form.Item
Image

💻 复现代码

© 版本信息

  • ProComponents 版本: [e.g. 4.0.0]
  • umi 版本
  • 浏览器环境
  • 开发环境 [e.g. mac OS]

🚑 其他信息

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions