uniapp+vue3+ts項目:實現小程序文件下載、預覽、進度監聽(含項目、案例、插件)
支持封裝調用:
- 項目采用uniapp+vue3+ts +京東nutUI 開發
- nutUi文檔:loadingPage組件:https://uniapp-nutui.tech/components/exhibition/loadingpage.html
案例效果圖:
- 略
博主自留地:參考本地項目klcsxt.sys小程序版 - 用戶手冊
案例:
- 案例效果圖:
真機截圖效果: - 微信開發者工具 · 調試截圖:
調用方式:
-
部分如下:
<template><view>···略···<template v-if="details.maintainFile && details.maintainFile.length >0"><view style="padding: 20px 0;">文件名稱:<view v-for="(item,index) in details.maintainFile"><view @click="previewFiles(item.name, item.url)" v-if="item.url" style="color: #335EFF">{{item.name}}</view></view></view></template><template v-else><view style="padding: 20px 0;">文件名稱:<text style="color: #335EFF">暫無匹配文件</text></view></template>···略···</view><nut-loading-page :loading="loading" :loadingText=