diff --git a/components/upload/Dragger.tsx b/components/upload/Dragger.tsx index 4366879fd7..0448004227 100644 --- a/components/upload/Dragger.tsx +++ b/components/upload/Dragger.tsx @@ -9,7 +9,7 @@ export type DraggerProps = UploadProps & { height?: number }; // eslint-disable-next-line react/prefer-stateless-function export default class Dragger extends React.Component { render() { - const { props } = this; - return ; + const { style, height, ...restProps } = this.props; + return ; } } diff --git a/components/upload/Upload.tsx b/components/upload/Upload.tsx index 08dc813043..21e49f7919 100644 --- a/components/upload/Upload.tsx +++ b/components/upload/Upload.tsx @@ -299,6 +299,14 @@ class Upload extends React.Component { delete rcUploadProps.className; delete rcUploadProps.style; + // Remove id to avoid open by label when trigger is hidden + // !children: https://github.com/ant-design/ant-design/issues/14298 + // disabled: https://github.com/ant-design/ant-design/issues/16478 + // https://github.com/ant-design/ant-design/issues/24197 + if (!children || disabled) { + delete rcUploadProps.id; + } + const uploadList = showUploadList ? ( {this.renderUploadList} @@ -342,13 +350,6 @@ class Upload extends React.Component { [`${prefixCls}-rtl`]: direction === 'rtl', }); - // Remove id to avoid open by label when trigger is hidden - // https://github.com/ant-design/ant-design/issues/14298 - // https://github.com/ant-design/ant-design/issues/16478 - if (!children || disabled) { - delete rcUploadProps.id; - } - const uploadButton = (
diff --git a/components/upload/__tests__/upload.test.js b/components/upload/__tests__/upload.test.js index 31391e3c4c..41711b9158 100644 --- a/components/upload/__tests__/upload.test.js +++ b/components/upload/__tests__/upload.test.js @@ -219,7 +219,7 @@ describe('Upload', () => { }); // https://github.com/ant-design/ant-design/issues/16478 - it('should not have id if upload is disabled, avoid being triggered by label', () => { + it('should not have id if Upload is disabled, avoid being triggered by label', () => { const Demo = ({ disabled }) => (
@@ -236,6 +236,24 @@ describe('Upload', () => { expect(wrapper.find('input#upload').length).toBe(0); }); + // https://github.com/ant-design/ant-design/issues/24197 + it('should not have id if upload.Dragger is disabled, avoid being triggered by label', () => { + const Demo = ({ disabled }) => ( + + + +
upload
+
+
+ + ); + + const wrapper = mount(); + expect(wrapper.find('input#upload').length).toBe(1); + wrapper.setProps({ disabled: true }); + expect(wrapper.find('input#upload').length).toBe(0); + }); + it('should be controlled by fileList', () => { const fileList = [ {