uniapp文件下载并预览

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

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

    
      
      {{ file.filename }}
    

 功能代码：

// 文件下载
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"
        });
      }
    }
  });
};

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