docs: update upload doc
parent
cfe002191b
commit
7a279f6651
|
@ -1,6 +1,6 @@
|
||||||
import { mount } from '@vue/test-utils'
|
import { mount } from '@vue/test-utils'
|
||||||
import Upload from '..'
|
import Upload from '..'
|
||||||
import { fileToObject } from '../utils'
|
import { T, fileToObject, genPercentAdd, getFileItem, removeFileItem } from '../utils'
|
||||||
import PropsTypes from '../../_util/vue-types'
|
import PropsTypes from '../../_util/vue-types'
|
||||||
import { UploadListProps } from '../interface'
|
import { UploadListProps } from '../interface'
|
||||||
|
|
||||||
|
@ -58,6 +58,47 @@ describe('Upload', () => {
|
||||||
}, 0)
|
}, 0)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
it('upload promise return file in beforeUpload', done => {
|
||||||
|
const data = jest.fn()
|
||||||
|
const props = {
|
||||||
|
propsData: {
|
||||||
|
action: 'http://upload.com',
|
||||||
|
beforeUpload: file =>
|
||||||
|
new Promise(resolve =>
|
||||||
|
setTimeout(() => {
|
||||||
|
const result = file
|
||||||
|
result.name = 'test.png'
|
||||||
|
resolve(result)
|
||||||
|
}, 100),
|
||||||
|
),
|
||||||
|
data,
|
||||||
|
},
|
||||||
|
listeners: {
|
||||||
|
change: ({ file }) => {
|
||||||
|
if (file.status !== 'uploading') {
|
||||||
|
expect(data).toBeCalled()
|
||||||
|
expect(file.name).toEqual('test.png')
|
||||||
|
done()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
slots: {
|
||||||
|
default: '<button>upload</button>',
|
||||||
|
},
|
||||||
|
sync: false,
|
||||||
|
}
|
||||||
|
|
||||||
|
const wrapper = mount(Upload, props)
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
wrapper.find({ name: 'ajaxUploader' }).vm.onChange({
|
||||||
|
target: {
|
||||||
|
files: [{ file: 'foo.png' }],
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}, 0)
|
||||||
|
})
|
||||||
|
|
||||||
it('should not stop upload when return value of beforeUpload is false', (done) => {
|
it('should not stop upload when return value of beforeUpload is false', (done) => {
|
||||||
const data = jest.fn()
|
const data = jest.fn()
|
||||||
const props = {
|
const props = {
|
||||||
|
@ -165,6 +206,11 @@ describe('Upload', () => {
|
||||||
})
|
})
|
||||||
|
|
||||||
describe('util', () => {
|
describe('util', () => {
|
||||||
|
// https://github.com/react-component/upload/issues/36
|
||||||
|
it('should T() return true', () => {
|
||||||
|
const res = T()
|
||||||
|
expect(res).toBe(true)
|
||||||
|
})
|
||||||
it('should be able to copy file instance', () => {
|
it('should be able to copy file instance', () => {
|
||||||
const file = new File([], 'aaa.zip')
|
const file = new File([], 'aaa.zip')
|
||||||
const copiedFile = fileToObject(file);
|
const copiedFile = fileToObject(file);
|
||||||
|
@ -172,6 +218,67 @@ describe('Upload', () => {
|
||||||
expect(key in copiedFile).toBe(true)
|
expect(key in copiedFile).toBe(true)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
it('should be able to progress from 0.1 ', () => {
|
||||||
|
// 0.1 -> 0.98
|
||||||
|
const getPercent = genPercentAdd()
|
||||||
|
let curPercent = 0
|
||||||
|
curPercent = getPercent(curPercent)
|
||||||
|
expect(curPercent).toBe(0.1)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should be able to progress to 0.98 ', () => {
|
||||||
|
// 0.1 -> 0.98
|
||||||
|
const getPercent = genPercentAdd()
|
||||||
|
let curPercent = 0
|
||||||
|
for (let i = 0; i < 500; i += 1) {
|
||||||
|
curPercent = getPercent(curPercent)
|
||||||
|
}
|
||||||
|
expect(parseFloat(curPercent.toFixed(2))).toBe(0.98)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should be able to get fileItem', () => {
|
||||||
|
const file = { uid: '-1', name: 'item.jpg' }
|
||||||
|
const fileList = [
|
||||||
|
{
|
||||||
|
uid: '-1',
|
||||||
|
name: 'item.jpg',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const targetItem = getFileItem(file, fileList)
|
||||||
|
expect(targetItem).toBe(fileList[0])
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should be able to remove fileItem', () => {
|
||||||
|
const file = { uid: '-1', name: 'item.jpg' }
|
||||||
|
const fileList = [
|
||||||
|
{
|
||||||
|
uid: '-1',
|
||||||
|
name: 'item.jpg',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
uid: '-2',
|
||||||
|
name: 'item2.jpg',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const targetItem = removeFileItem(file, fileList)
|
||||||
|
expect(targetItem).toEqual(fileList.slice(1))
|
||||||
|
})
|
||||||
|
|
||||||
|
it('should not be able to remove fileItem', () => {
|
||||||
|
const file = { uid: '-3', name: 'item.jpg' }
|
||||||
|
const fileList = [
|
||||||
|
{
|
||||||
|
uid: '-1',
|
||||||
|
name: 'item.jpg',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
uid: '-2',
|
||||||
|
name: 'item2.jpg',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const targetItem = removeFileItem(file, fileList)
|
||||||
|
expect(targetItem).toBe(null)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should support linkProps as object', () => {
|
it('should support linkProps as object', () => {
|
||||||
|
|
|
@ -56,7 +56,7 @@ export default {
|
||||||
if (file.response) {
|
if (file.response) {
|
||||||
return file.response.status === 'success';
|
return file.response.status === 'success';
|
||||||
}
|
}
|
||||||
return true;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
this.fileList = fileList
|
this.fileList = fileList
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
| Property | Description | Type | Default |
|
| 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 | - |
|
| accept | File types that can be accepted. See [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept) | string | - |
|
||||||
| action | 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 |
|
| 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. **Warning:this function is not supported in IE9**。 | (file, fileList) => `boolean | Promise` | - |
|
| beforeUpload | Hook function which will be executed before uploading. Uploading will be stopped with `false` or a rejected Promise returned. **Warning:this function is not supported in IE9**。 | (file, fileList) => `boolean | Promise` | - |
|
||||||
|
|
|
@ -4,10 +4,10 @@
|
||||||
|
|
||||||
| 参数 | 说明 | 类型 | 默认值 |
|
| 参数 | 说明 | 类型 | 默认值 |
|
||||||
| --- | --- | --- | --- |
|
| --- | --- | --- | --- |
|
||||||
| accept | 接受上传的文件类型, 详见 [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept) | string | 无 |
|
| accept | 接受上传的文件类型, 详见 [input accept Attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#accept) | string | 无 |
|
||||||
| action | 上传的地址 | string\|(file) => `Promise` | 无 |
|
| action | 上传的地址 | string\|(file) => `Promise` | 无 |
|
||||||
| directory | 支持上传文件夹([caniuse](https://caniuse.com/#feat=input-file-directory))| boolean | false |
|
| directory | 支持上传文件夹([caniuse](https://caniuse.com/#feat=input-file-directory))| boolean | false |
|
||||||
| beforeUpload | 上传文件之前的钩子,参数为上传的文件,若返回 `false` 则停止上传。支持返回一个 Promise 对象,Promise 对象 reject 时则停止上传,resolve 时开始上传。**注意:IE9 不支持该方法**。 | (file, fileList) => `boolean | Promise` | 无 |
|
| beforeUpload | 上传文件之前的钩子,参数为上传的文件,若返回 `false` 则停止上传。支持返回一个 Promise 对象,Promise 对象 reject 时则停止上传,resolve 时开始上传( resolve 传入 `File` 或 `Blob` 对象则上传 resolve 传入对象)。**注意:IE9 不支持该方法**。 | (file, fileList) => `boolean | Promise` | 无 |
|
||||||
| customRequest | 通过覆盖默认的上传行为,可以自定义自己的上传实现 | Function | 无 |
|
| customRequest | 通过覆盖默认的上传行为,可以自定义自己的上传实现 | Function | 无 |
|
||||||
| data | 上传所需参数或返回上传参数的方法 | object\|(file) => object | 无 |
|
| data | 上传所需参数或返回上传参数的方法 | object\|(file) => object | 无 |
|
||||||
| defaultFileList | 默认已经上传的文件列表 | object\[] | 无 |
|
| defaultFileList | 默认已经上传的文件列表 | object\[] | 无 |
|
||||||
|
|
Loading…
Reference in New Issue