classUploadThumbextendsPureComponent{constructor(props){super(props);this.state={loading:false,imageUrl:""};}handleChange(info){if(info.file.status==="uploading"){this.setState({loading:true});return;}if(info.file.status==="done"){// Get this url from response in real world.this.getBase64(info.file.originFileObj,imageUrl=>this.setState({imageUrl,loading:false}));}}getBase64(img,callback){constreader=newFileReader();reader.addEventListener("load",()=>callback(reader.result));reader.readAsDataURL(img);}beforeUpload(file){constisJPG=file.type==="image/jpeg";if(!isJPG){message.error("You can only upload JPG file!");}constisLt2M=file.size/1024/1024<2;if(!isLt2M){message.error("Image must smaller than 2MB!");}returnisJPG&&isLt2M;}render(){constuploadButton=(<div><Icontype={this.state.loading?"loading":"plus"}/><divclassName="ant-upload-text">Upload</div></div>);return(<Uploadname="avatar"listType="picture-card"className="avatar-uploader"showUploadList={false}action="/upload"beforeUpload={this.beforeUpload.bind(this)}onChange={this.handleChange.bind(this)}>{this.state.imageUrl?(<imgsrc={this.state.imageUrl}alt=""/>):(uploadButton)}</Upload>);}}