一、wxml文件

1、写文本框,用来获取文件链接。

2、按钮,点击下载文件

<!-- 下载文件(word/excel/ppt/pdf等) -->
<view class="inputContent">
<text>请输入下载链接:</text>
<input type="text" bindinput="getContent"></input>
</view>
<button bindtap="downloadFile" type="primary" >下载文件</button>

二、wxss文件

wxss文件用来设置文本框显示样式

.inputContent{
margin: 100rpx 20rpx 20rpx 20rpx;
}
input{
border: 1rpx solid #ccc;
margin-top: 20rpx;
height: 80rpx;
min-height: 80rpx;
}

三、js文件

获取输入内容getContent()和downloadFile()两个函数。文本框里面输入的是文件的file ID(云存储的路径),自动打开文件

Page({
data:{
fileID :null
},
//功能:下载并自动打开文件(word/excel/ppt/pdf等) //获取输入内容
getContent(e){
console.log(e.detail.value);
this.setData({
fileID:e.detail.value
})
}, //下载文件
downloadFile(){
let fileID = this.data.fileID //取data里面的fileID
if(fileID!=null&&fileID.length>0){
console.log("下载链接",fileID);
wx.cloud.downloadFile({
fileID: fileID,
success: res => {
console.log("文件下载成功",res);
//提示框
wx.showToast({
title: '文件下载成功',
icon:"success",
duration:2000
}) //打开文件
const filePath = res.tempFilePath
wx.openDocument({
filePath: filePath,
success: function (res) {
console.log('打开文档成功',res)
}
})
},
fail: err => {
console.log("文件下载失败",err);
}
})
}else{
wx.showToast({
title: '下载链接为空',
icon:"none"
})
}
} })

四、实现

微信小程序云开发-云存储-下载并打开文件文件(word/excel/ppt/pdf)的更多相关文章

  1. 微信小程序云开发-云存储-上传文件(word/excel/ppt/pdf)到云存储

    说明 word/excel/ppt/pdf是从客户端会话选择文件.使用chooseMessageFile中选择文件. 一.wxml文件 上传按钮,绑定chooseFile <!--上传文件(wo ...

  2. 微信小程序云开发-云存储-上传、下载、打开文件文件(word/excel/ppt/pdf)一步到位

    一.wxml文件 <!-- 上传.下载.打开文件一步执行 --> <view class="handle"> <button bindtap=&quo ...

  3. 微信小程序-视频教程-百度云-下载

    链接: https://pan.baidu.com/s/16WGL3whutozx-UXqsDPhhA 提取码: 关注公众号[GitHubCN]回复获取   什么是微信小程序?小程序是一种不需要下载安 ...

  4. 微信小程序+腾讯云直播的实时音视频实战笔记

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  5. 微信小程序腾讯云php后台解决方案

    微信小程序腾讯云php后台解决方案 微信小程序前段需要添加必要的文件以配合后端 (1)wafer2-client-sdk sdk提供了几种接口包括登陆,获取用户openid,图片上传等 (2)conf ...

  6. 《微信小程序商城开发实战》笔者的新书,欢迎各位粉丝上京东购买

    作者图书京东链接,请点击------>>>    **微信小程序商城开发实战** 附京东真实评价截图: 编辑推荐 在当今移动互联网大潮中,微信应用凭借其庞大的用户基数和极强的用户黏性 ...

  7. Django微信小程序后台开发教程

    本文链接:https://blog.csdn.net/qq_43467898/article/details/83187698Django微信小程序后台开发教程1 申请小程序,创建hello worl ...

  8. vue+uni-app商城实战 | 第一篇:【有来小店】微信小程序快速开发接入Spring Cloud OAuth2认证中心完成授权登录

    一. 前言 本篇通过实战来讲述如何使用uni-app快速进行商城微信小程序的开发以及小程序如何接入后台Spring Cloud微服务. 有来商城 youlai-mall 项目是一套全栈商城系统,技术栈 ...

  9. 微信小程序快速开发

    微信小程序快速开发 一.注册小程序账号,下载IDE 1.官网注册https://mp.weixin.qq.com/,并下载IDE. 2.官方文档一向都是最好的学习资料. 注意:1)注册账号之后会有一个 ...

随机推荐

  1. Pipe Utilization管道利用率

    Pipe Utilization管道利用率 概述 CUDA设备的每个流式多处理器(SM)都具有许多专门用于执行特定任务的硬件单元.在芯片级,这些单元提供执行管道,翘曲调度程序将指令发送到这些管道.例如 ...

  2. GPU端到端目标检测YOLOV3全过程(上)

    GPU端到端目标检测YOLOV3全过程(上) Basic Parameters: Video: mp4, webM, avi Picture: jpg, png, gif, bmp Text: doc ...

  3. sql 处理数据字段为NULL 若不为空则显示该值,若为空转换成别的值。

    第一种方法: 判断字段是否为空,如果为空转成你要的字符 1.oracle : nvl("字段名",'转换后的值')://字段名是双引号,转换后的值是单引号 2.sql Server ...

  4. linux环境下jmeter安装和运行

    linux环境部署: 在Linux服务器先安装jdk:2.以jdk-8u172-linux-x64.tar.gz为例:下载地址:http://www.oracle.com/technetwork/ja ...

  5. Maven execution terminated abnormally (exit code 1) 完美解决

    https://www.pianshen.com/article/1477185745/ 找到本地仓库这个包中, 删掉,重新导入,,完美解决

  6. Springboot中以配置类方式自定义Mybatis的配置规则(如开启驼峰映射等)

    什么是自定义Mybatis的配置规则? 答:即原来在mybatis配置文件中中我们配置到<settings>标签中的内容,如下第6-10行内容: 1 <?xml version=&q ...

  7. MySQL基础练习

    表的一些基本操作 1.导入sql文件 source + 文件位置 2.查询某列的数据 select col1, col2, col3 from table 3.查询所有数据 select * from ...

  8. 剑指 Offer 07. 重建二叉树

    链接:https://leetcode-cn.com/problems/zhong-jian-er-cha-shu-lcof/ 标签:树.递归 题目 输入某二叉树的前序遍历和中序遍历的结果,请重建该二 ...

  9. Java第一次博客作业

    第一次博客作业 目录 三次作业题目详情 作业中的错误分析 感想与心得 题目详情 题目1:第一次作业: 类图: 题目2 类图: 题目3 类图: 题目4 题目5 题目6 类图: 题目7 类图: 题目8 第 ...

  10. 不管卷不卷,面试还是得问问你G1原理!

    所有的垃圾回收器的目的都是朝着减少STW的目的而前进,G1(Garbage First)回收器的出现颠覆了之前版本CMS.Parallel等垃圾回收器的分代收集方式,从2004年Sun发布第一篇关于G ...