傅行帆 5 лет назад
Родитель
Сommit
d79926987a
1 измененных файлов: 10 добавлений и 2 удалений
  1. 10
    2
      src/components/uploadImage/ImageUpload.jsx

+ 10
- 2
src/components/uploadImage/ImageUpload.jsx Просмотреть файл

1
 import React from 'react';
1
 import React from 'react';
2
-import { Upload, Icon, message } from 'antd';
2
+import { Upload, Icon, message, Modal } from 'antd';
3
 import './style.less';
3
 import './style.less';
4
 import { uploaderProps } from '../../utils/upload';
4
 import { uploaderProps } from '../../utils/upload';
5
 
5
 
41
     }
41
     }
42
   };
42
   };
43
 
43
 
44
+  handleCancel = () => this.setState({ previewVisible: false });
45
+
44
   handlePreview = async file => {
46
   handlePreview = async file => {
47
+    console.log(file)
45
     this.setState({
48
     this.setState({
46
-      previewImage: file.response,
49
+      previewImage: file.url,
47
       previewVisible: true,
50
       previewVisible: true,
48
     });
51
     });
49
   };
52
   };
56
     );
59
     );
57
 
60
 
58
     return (
61
     return (
62
+      <>
59
       <Upload
63
       <Upload
60
         {...uploaderProps}
64
         {...uploaderProps}
61
         listType="picture-card"
65
         listType="picture-card"
66
       >
70
       >
67
         {this.state.fileList.length >= 1 ? null : uploadButton}  
71
         {this.state.fileList.length >= 1 ? null : uploadButton}  
68
       </Upload>
72
       </Upload>
73
+      <Modal visible={this.state.previewVisible} footer={null} onCancel={this.handleCancel}>
74
+      <img alt="example" style={{ width: '100%' }} src={this.state.previewImage} />
75
+      </Modal>
76
+      </>
69
     );
77
     );
70
   }
78
   }
71
 }
79
 }