import React from 'react';
import {
Upload,
} from 'antd';
class upload extends React.Component {
constructor(props) {
super(props)
this.state = {
fileList:[], //文件列表
};
}
// 上传之前事件
beforeUpload = (file) => {
var fileArr = [];
//获取新的上传列表
fileArr.push(file);
//进行赋值保存
this.setState(preState => ({
fileList:fileArr,
uploadPath:''
}))
}
// 文件上传改变事件
updateChange = (info) => {
if (info.file.status === 'done') {
//上传成功后将后台返回来的文件地址进行获取--info.file.response
if (info.file.response) {
this.setState(preState => ({
uploadPath : info.file.response.Data,
})
)
}
message.success('上传成功!');
} else if (info.file.status === 'error') {
//上传失败进行提示
message.error('上传失败!');
}
}
// 移除文件
removeFile = () => {
this.setState(preState => ({
fileList:[],
uploadPath : ‘’
})
)
}
render() {
const {
fileList,
} = this.state;
return (
<div>
<Upload
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel," //上传文件类型--这个是excel类型
action = {‘http://dbsahdfff.com/api/upload’} 上传文件地址
fileList = {fileList} //上传文件列表
beforeUpload={this.beforeUpload} //上传之前触发事件
onChange={this.updateChange} //上传状态改变事件
onRemove = {this.removeFile} //移除文件事件
>
<div>上传文件</div>
</Upload>
</div>
)
}
}
export default upload