大概就是这样的咯,文件展示到页面上,点击文件下载并预览该文件;
通过点击事件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"});}}});
};
样式的话,大家根据自己需求写吧,我只功能代码展示出来就可以了;