提交 f229f86a 编写于 作者: A afc163

Fix multiple upload

上级 1056af34
......@@ -14,6 +14,7 @@
* 新增 `fileList``defaultFileList` 属性,以满足更多的自定义功能,具体见演示。
* 设置 fileList 数组项的 url 属性可以作为链接展示在文件列表中方便下载。
* 移除内建的上传成功或失败的信息提示,业务可自行实现。
* 修正多文件选择上传时文件列表只展示一个文件的问题。
### Table
......
# 多文件选择
- order: 5
按住 ctrl 可选择多个文件,`ie10+` 支持。
---
````jsx
var Upload = antd.Upload;
var message = antd.message;
var props = {
action: '/upload.do',
multiple: true,
onChange(info) {
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList);
}
}
};
React.render(
<Upload {...props}>
<button type="button" className="ant-btn ant-btn-ghost">
<i className="anticon anticon-upload"></i> 点击上传
</button>
</Upload>
, document.getElementById('components-upload-demo-multiple'));
````
......@@ -15,12 +15,10 @@ const AntUpload = React.createClass({
};
},
onStart(file) {
let nextFileList = this.state.fileList.concat();
file.status = 'uploading';
nextFileList.push(file);
this.onChange({
file: file,
fileList: nextFileList
add: true
});
},
removeFile(file) {
......@@ -76,9 +74,18 @@ const AntUpload = React.createClass({
// 1. 有设置外部属性时不改变 fileList
// 2. 上传中状态(info.event)不改变 fileList
if (!('fileList' in this.props) && !info.event) {
this.setState({
fileList: info.fileList
});
// 新增文件时,使用 multiple 属性会造成同时 setState
if (info.add) {
this.setState((prevState) => {
return {
fileList: prevState.fileList.concat(info.file)
};
});
} else {
this.setState({
fileList: info.fileList
});
}
}
this.props.onChange(info);
},
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册