| | |
| | | <!-- <div class="close" @click="closeHandle">x</div> --> |
| | | <slot :files="files" :file-list="fileList" :started="started"> |
| | | <uploader-unsupport></uploader-unsupport> |
| | | <uploader-drop> |
| | | <!-- <p>拖动文件到该区域上传</p> --> |
| | | <UploaderDrop> |
| | | <p>拖动文件到该区域上传</p> |
| | | |
| | | <uploader-btn >选择文件</uploader-btn> |
| | | <uploader-btn :directory="true" >选择文件夹</uploader-btn> |
| | | </uploader-drop> |
| | | </UploaderDrop> |
| | | <uploader-list></uploader-list> |
| | | </slot> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | //import Uploader from 'simple-uploader.js' |
| | | //require('./common/uploader-simple') |
| | | import './common/uploader-simple' |
| | | import Uploader from 'simple-uploader.js' |
| | | import { kebabCase } from './common/utils' |
| | | import UploaderBtn from './btn.vue' |
| | | import UploaderDrop from './drop.vue' |
| | |
| | | return { |
| | | uploader: this |
| | | } |
| | | }, |
| | | watch:{ |
| | | attrs:{ |
| | | handler(n,o){ |
| | | console.log('uploader attrs update',n) |
| | | //this.$nextTick(()=>{ |
| | | this.unBindUploader(); |
| | | this.bindUploader(); |
| | | //}) |
| | | }, |
| | | deep: true |
| | | }, |
| | | |
| | | }, |
| | | props: { |
| | | attrs: { |
| | |
| | | }, |
| | | closeHandle() { |
| | | this.$emit("close") |
| | | }, |
| | | bindUploader(){ |
| | | console.log('new Uploader') |
| | | this.options.initialPaused = !this.autoStart |
| | | const uploader = new Uploader(this.options) |
| | | this.uploader = uploader |
| | | this.uploader.fileStatusText = this.fileStatusText |
| | | uploader.on('catchAll', this.allEvent) |
| | | uploader.on(FILE_ADDED_EVENT, this.fileAdded) |
| | | uploader.on(FILES_ADDED_EVENT, this.filesAdded) |
| | | uploader.on('fileRemoved', this.fileRemoved) |
| | | uploader.on('filesSubmitted', this.filesSubmitted) |
| | | }, |
| | | unBindUploader(){ |
| | | const uploader = this.uploader |
| | | uploader.off('catchAll', this.allEvent) |
| | | uploader.off(FILE_ADDED_EVENT, this.fileAdded) |
| | | uploader.off(FILES_ADDED_EVENT, this.filesAdded) |
| | | uploader.off('fileRemoved', this.fileRemoved) |
| | | uploader.off('filesSubmitted', this.filesSubmitted) |
| | | this.uploader = null |
| | | } |
| | | }, |
| | | created() { |
| | | console.log('uploader attrs',this.attrs); |
| | | this.bindUploader(); |
| | | // this.options.initialPaused = !this.autoStart |
| | | // const uploader = new Uploader(this.options) |
| | | // this.uploader = uploader |
| | | // this.uploader.fileStatusText = this.fileStatusText |
| | | // uploader.on('catchAll', this.allEvent) |
| | | // uploader.on(FILE_ADDED_EVENT, this.fileAdded) |
| | | // uploader.on(FILES_ADDED_EVENT, this.filesAdded) |
| | | // uploader.on('fileRemoved', this.fileRemoved) |
| | | // uploader.on('filesSubmitted', this.filesSubmitted) |
| | | // console.log('uploader attrs',this.attrs); |
| | | // this.bindUploader(); |
| | | this.options.initialPaused = !this.autoStart |
| | | const uploader = new Uploader(this.options) |
| | | this.uploader = uploader |
| | | this.uploader.fileStatusText = this.fileStatusText |
| | | uploader.on('catchAll', this.allEvent) |
| | | uploader.on(FILE_ADDED_EVENT, this.fileAdded) |
| | | uploader.on(FILES_ADDED_EVENT, this.filesAdded) |
| | | uploader.on('fileRemoved', this.fileRemoved) |
| | | uploader.on('filesSubmitted', this.filesSubmitted) |
| | | }, |
| | | mounted(){ |
| | | //this.bindUploader(); |
| | | mounted() { |
| | | }, |
| | | destroyed() { |
| | | this.unBindUploader(); |
| | | // const uploader = this.uploader |
| | | // uploader.off('catchAll', this.allEvent) |
| | | // uploader.off(FILE_ADDED_EVENT, this.fileAdded) |
| | | // uploader.off(FILES_ADDED_EVENT, this.filesAdded) |
| | | // uploader.off('fileRemoved', this.fileRemoved) |
| | | // uploader.off('filesSubmitted', this.filesSubmitted) |
| | | // this.uploader = null |
| | | const uploader = this.uploader |
| | | uploader.off('catchAll', this.allEvent) |
| | | uploader.off(FILE_ADDED_EVENT, this.fileAdded) |
| | | uploader.off(FILES_ADDED_EVENT, this.filesAdded) |
| | | uploader.off('fileRemoved', this.fileRemoved) |
| | | uploader.off('filesSubmitted', this.filesSubmitted) |
| | | this.uploader = null |
| | | }, |
| | | components: { |
| | | UploaderBtn, |
| | |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | |
| | | </style> |