Package Exports
- dacong-chunked-upload
- dacong-chunked-upload/main.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (dacong-chunked-upload) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
安装
npm install dacong-chunked-upload@latest使用
<script setup>
import { postUploadFile, mergeUploadFile, verifyUpload, deleteFile } from './api/upload'
import { ChunkedUpload, uploadFile } from 'dacong-chunked-upload'
/*
uploadFile为定义好的上传函数，upload(file,taskArr)
file为文件
taskArr为响应式数组 🌰const taskArr = ref([])
*/
/*
postUploadFile : 上传分片
mergeUploadFile : 合并分片
verifyUpload : 检查文件是否存在
deleteFile : 删除文件
*/
</script>
<template>
<ChunkedUpload :api="{ postUploadFile, mergeUploadFile, verifyUpload, deleteFile }">
<template #placeholder-footer>
<!-- 自定义提示内容 -->
</template>
<template #content>
<!-- 自定义内部内容，只有在showPlaceholder为false的时候生效 -->
</template>
<template #footer>
<!-- 自定义底部内容 -->
</template>
</ChunkedUpload>
</template>Props
{
disableUpload:'', //Boolean 是否允许上传 default:false
allowClick:'', //allowClick 是否允许点击上传 default:true
allowDrop:'', //Boolean 是否允许拖拽上传 default:true
fileNumberMax:'', //Number 允许上传的最大文件数 default:5
fileSizeMax:'', //Number 允许上传的单个文件最大大小 default:50
showPlaceholder:'', //Boolean 是否展示默认占位符 default:true
api:'', //Object 自定义上传相关的api required: true
minHeight:'', //Number 上传框最小高度 default:280
listType:'' //String 上传后文件展示的样式 card/list default:card validator:['card', 'list']
isAbsolute:'', //Boolean 是否采用 absolute 定位 default:false
fileList:'', // Array 展示的文件列表 default:[]
background:'' // String 自定义背景色 default:''
}Emits
{
deleteFile, // 删除文件的抛出事件 得到文件的id
uploadEnd, // 上传文件后的抛出事件 得到文件的id
}注意事项
这是
Vue3的组件这需要后端使用特定的接口去配合使用
不提供
api无法工作api后面会打包