📝 Upload action is not required prop

This commit is contained in:
afc163 2018-11-19 18:52:47 +08:00
parent 5705dc8157
commit 13c25adc6d
No known key found for this signature in database
GPG Key ID: 738F973FCE5C6B48
3 changed files with 11 additions and 18 deletions

View File

@ -57,13 +57,12 @@ class Demo extends React.Component {
}
render() {
const { uploading } = this.state;
const { uploading, fileList } = this.state;
const props = {
action: '//jsonplaceholder.typicode.com/posts/',
onRemove: (file) => {
this.setState(({ fileList }) => {
const index = fileList.indexOf(file);
const newFileList = fileList.slice();
this.setState((state) => {
const index = state.fileList.indexOf(file);
const newFileList = state.fileList.slice();
newFileList.splice(index, 1);
return {
fileList: newFileList,
@ -71,12 +70,12 @@ class Demo extends React.Component {
});
},
beforeUpload: (file) => {
this.setState(({ fileList }) => ({
fileList: [...fileList, file],
this.setState(state => ({
fileList: [...state.fileList, file],
}));
return false;
},
fileList: this.state.fileList,
fileList,
};
return (
@ -87,11 +86,11 @@ class Demo extends React.Component {
</Button>
</Upload>
<Button
className="upload-demo-start"
type="primary"
onClick={this.handleUpload}
disabled={this.state.fileList.length === 0}
disabled={fileList.length === 0}
loading={uploading}
style={{ marginTop: 16 }}
>
{uploading ? 'Uploading' : 'Start Upload' }
</Button>
@ -102,9 +101,3 @@ class Demo extends React.Component {
ReactDOM.render(<Demo />, mountNode);
````
````css
.upload-demo-start {
margin-top: 16px;
}
````

View File

@ -21,7 +21,7 @@ Uploading is the process of publishing information (web pages, text, pictures, v
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| accept | File types that can be accepted. See [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept) | string | - |
| action | Required. Uploading URL | string\|(file) => `Promise` | - |
| action | Uploading URL | string\|(file) => `Promise` | - |
| directory | support upload whole directory ([caniuse](https://caniuse.com/#feat=input-file-directory)) | boolean | false |
| beforeUpload | Hook function which will be executed before uploading. Uploading will be stopped with `false` or a rejected Promise returned. **Warningthis function is not supported in IE9**。 | (file, fileList) => `boolean | Promise` | - |
| customRequest | override for the default xhr behavior allowing for additional customization and ability to implement your own XMLHttpRequest | Function | - |

View File

@ -22,7 +22,7 @@ title: Upload
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| accept | 接受上传的文件类型, 详见 [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept) | string | 无 |
| action | 必选参数, 上传的地址 | string\|(file) => `Promise` | 无 |
| action | 上传的地址 | string\|(file) => `Promise` | 无 |
| directory | 支持上传文件夹([caniuse](https://caniuse.com/#feat=input-file-directory)| boolean | false |
| beforeUpload | 上传文件之前的钩子,参数为上传的文件,若返回 `false` 则停止上传。支持返回一个 Promise 对象Promise 对象 reject 时则停止上传resolve 时开始上传。**注意IE9 不支持该方法**。 | (file, fileList) => `boolean | Promise` | 无 |
| customRequest | 通过覆盖默认的上传行为,可以自定义自己的上传实现 | Function | 无 |