uniapp文件下载并预览

news/2024/11/17 21:32:26/

大概就是这样的咯,文件展示到页面上,点击文件下载并预览该文件; 

 通过点击事件handleDownLoad(file.path),file.path为文件的地址;

<view class="files"><view class="cont" v-for="(file, index) in dataInfo.experience" :key="index" @click="handleDownLoad(file.path)"><image:src="file.path.split('.')[1] == 'word' ? '/static/images/icons/icon_word.png' : '/static/images/icons/icon_pdf.png'"mode="scaleToFill"/><text>{{ file.filename }}</text></view>
</view>

 功能代码:

// 文件下载
const handleDownLoad = (path: string) => {if (!path) return;Loading("加载中");uni.downloadFile({url: fullUrl(path),//完整地址success: res => {if (res.statusCode === 200) {uni.getFileSystemManager().saveFile({tempFilePath: res.tempFilePath,success: function (res1) {const savedFilePath = res1.savedFilePath;HideLoading();// 打开文件uni.openDocument({filePath: savedFilePath,success: function (res2) {console.log(res2);}});}});} else {Toast("下载失败", {icon: "error"});}}});
};

样式的话,大家根据自己需求写吧,我只功能代码展示出来就可以了;


http://www.ppmy.cn/news/1022725.html

相关文章

Boost开发指南-4.3optional

optional 在实际的软件开发过程中我们经常会遇到“无效值”的情况&#xff0c;例如函数并不是总能返回有效值&#xff0c;很多时候函数正确执行了&#xff0c;但结果却不是合理的值。如果用数学语言来解释&#xff0c;就是返回值位于函数解空间之外。 求一个数的倒数&#xf…

在Linux上进行项目部署--手动和自动

在Linux上进行项目部署–手动和自动 文章目录 在Linux上进行项目部署--手动和自动1、手动部署项目2、通过Shell脚本自动部署项目 1、手动部署项目 1、在IDEA中开发SpringBoot项目并打成jar包 在idea中的Maven中的package&#xff08;基于Springboot项目&#xff09; 2、将jar包…

谷粒商城第十一天-完善商品分组(主要添上关联属性)

目录 一、总述 二、前端部分 2.1 改良前端获取分组列表接口及其调用 2.2 添加关联的一整套逻辑 三、后端部分 四、总结 一、总述 前端部分和之前的商品品牌添加分类差不多。 也是修改一下前端的分页获取列表的接口&#xff0c;还有就是加上关联的那一套逻辑&#xff0c;…

分享一颗能用在TYPE-C接口取电协议芯片LDR6328Q,方便好用

芯片功能&#xff1a;诱导PD充电器输出最大功率&#xff0c;支持最大诱骗20V电压。支持协议&#xff1a;PD/QC/三星AFC/华为SCP等主流快充协议 芯片封装&#xff1a;QFN16,SOP8多封装选择 芯片应用&#xff1a; 桶形连接器替换&#xff08;BCR&#xff09;&#xff0c;USB-A和m…

NIO 非阻塞式IO

NIO Java NIO 基本介绍 Java NIO 全称 Java non-blocking IO&#xff0c;是指 JDK 提供的新 API。从 JDK1.4 开始&#xff0c;Java 提供了一系列改进的输入/输出的新特性&#xff0c;被统称为 NIO&#xff08;即 NewIO&#xff09;&#xff0c;是同步非阻塞的。NIO 相关类都被…

【LeetCode】买卖股票的最佳时机含冷冻期

买卖股票的最佳时机含冷冻期 题目描述算法分析程序设计 链接: 买卖股票的最佳时机含冷冻期 题目描述 算法分析 程序设计 class Solution { public:int maxProfit(vector<int>& prices) {int n prices.size();//天数vector<vector<int>> dp(n,vector&l…

Linux C++ 网络编程基础(2) : TCP多线程一个server对应多个client

目录 一、linux posix线程相关函数介绍二、tcp server基础版本三、tpc服务端多线程版本四、tpc客户端代码tcp编程时, 一个server可以对应多个client, server端用多线程可以实现. linux下多线程可以使用POSIX的线程函数, 下面给出服务端和客户端的代码. 一、linux posix线程相关…

Flutter 报错 Could not create task ‘xxx‘.this and base files have different roots

遇到此问题也是先去百度了&#xff0c;有的说改了Gradle版本、gradle-wrapper.properties版本和ext.kotlin_version版本之后解决的&#xff0c;我没尝试&#xff0c;我用蹩脚的英语大致读了一下就不是这样说的&#xff0c;况且我用有道翻译了也不是这个意思啊&#xff0c;我不知…