1.0.8 • Published 20 days ago
ontall-uploader v1.0.8
概述
基于vue-simple-uploader(vue2),支持分片上传、断点续传。可以全局使用(以EventBus通信),也可以在组件中单独使用。
安装
npm install ontall-uploader --save
安装依赖包vue-simple-uploader和spark-md5:
npm install vue-simple-uploader --save
npm install spark-md5 --save
使用
(1)全局使用
main.js中引入组件,同时初始化EventBus:
import OntallUploader from 'ontall-uploader'
Vue.use(OntallUploader)
Vue.prototype.$Bus=new Vue()
使用: 在App.vue中:
<template>
<div id="app">
<router-view />
<!-- 将上传组件全局注册 -->
<OntallUploader :global="true"></OntallUploader>
</div>
</template>
<script>
import OntallUploader from '@/components/Uploader'
export default {
name: 'App'
}
</script>
需要上传文件的地方,通过EventBus唤起全局上传组件:
this.$Bus.$emit('openUploader')
(2)单个组件使用
引入组件:
import OntallUploader from 'ontall-uploader'
使用:
<OntallUploader :global="false" :options="uploader.options"></OntallUploader>
配置项说明
属性 | 类型 | 说明 |
---|---|---|
global | Boolean | 是否全局上传,默认true |
options | Object | 上传配置项,具体参考:vue-simple-uploader文档 |
input-attrs | Object | input框的属性,比如设置input的accept来确定可上传的文件类型:{ accept:'.jpg' } |