diff --git a/packages/upload/src/index.vue b/packages/upload/src/index.vue index 5dbb2cf6d..3b84bd6c9 100644 --- a/packages/upload/src/index.vue +++ b/packages/upload/src/index.vue @@ -19,8 +19,10 @@ export default { IframeUpload }, - provide: { - uploader: this + provide() { + return { + uploader: this + }; }, inject: { diff --git a/packages/upload/src/upload-dragger.vue b/packages/upload/src/upload-dragger.vue index c718076e3..b3293c6f5 100644 --- a/packages/upload/src/upload-dragger.vue +++ b/packages/upload/src/upload-dragger.vue @@ -17,6 +17,11 @@ props: { disabled: Boolean }, + inject: { + uploader: { + default: '' + } + }, data() { return { dragover: false @@ -29,10 +34,35 @@ } }, onDrop(e) { - if (!this.disabled) { - this.dragover = false; + if (this.disabled || !this.uploader) return; + const accept = this.uploader.accept; + this.dragover = false; + if (!accept) { this.$emit('file', e.dataTransfer.files); + return; } + this.$emit('file', [].slice.call(e.dataTransfer.files).filter(file => { + const { type, name } = file; + const extension = name.indexOf('.') > -1 + ? `.${ name.split('.').pop() }` + : ''; + const baseType = type.replace(/\/.*$/, ''); + return accept.split(',') + .map(type => type.trim()) + .filter(type => type) + .some(acceptedType => { + if (/\..+$/.test(acceptedType)) { + return extension === acceptedType; + } + if (/\/\*$/.test(acceptedType)) { + return baseType === acceptedType.replace(/\/\*$/, ''); + } + if (/^[^\/]+\/[^\/]+$/.test(acceptedType)) { + return type === acceptedType; + } + return false; + }); + })); } } };