微信小程序云开发-云存储-下载并打开文件文件(word/excel/ppt/pdf)
一、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)的更多相关文章
- 微信小程序云开发-云存储-上传文件(word/excel/ppt/pdf)到云存储
说明 word/excel/ppt/pdf是从客户端会话选择文件.使用chooseMessageFile中选择文件. 一.wxml文件 上传按钮,绑定chooseFile <!--上传文件(wo ...
- 微信小程序云开发-云存储-上传、下载、打开文件文件(word/excel/ppt/pdf)一步到位
一.wxml文件 <!-- 上传.下载.打开文件一步执行 --> <view class="handle"> <button bindtap=&quo ...
- 微信小程序-视频教程-百度云-下载
链接: https://pan.baidu.com/s/16WGL3whutozx-UXqsDPhhA 提取码: 关注公众号[GitHubCN]回复获取 什么是微信小程序?小程序是一种不需要下载安 ...
- 微信小程序+腾讯云直播的实时音视频实战笔记
欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...
- 微信小程序腾讯云php后台解决方案
微信小程序腾讯云php后台解决方案 微信小程序前段需要添加必要的文件以配合后端 (1)wafer2-client-sdk sdk提供了几种接口包括登陆,获取用户openid,图片上传等 (2)conf ...
- 《微信小程序商城开发实战》笔者的新书,欢迎各位粉丝上京东购买
作者图书京东链接,请点击------>>> **微信小程序商城开发实战** 附京东真实评价截图: 编辑推荐 在当今移动互联网大潮中,微信应用凭借其庞大的用户基数和极强的用户黏性 ...
- Django微信小程序后台开发教程
本文链接:https://blog.csdn.net/qq_43467898/article/details/83187698Django微信小程序后台开发教程1 申请小程序,创建hello worl ...
- vue+uni-app商城实战 | 第一篇:【有来小店】微信小程序快速开发接入Spring Cloud OAuth2认证中心完成授权登录
一. 前言 本篇通过实战来讲述如何使用uni-app快速进行商城微信小程序的开发以及小程序如何接入后台Spring Cloud微服务. 有来商城 youlai-mall 项目是一套全栈商城系统,技术栈 ...
- 微信小程序快速开发
微信小程序快速开发 一.注册小程序账号,下载IDE 1.官网注册https://mp.weixin.qq.com/,并下载IDE. 2.官方文档一向都是最好的学习资料. 注意:1)注册账号之后会有一个 ...
随机推荐
- JMeter使用教程2——MySQL压测
之前写过一篇JMeter使用教程,只是介绍了http请求的压力测试,想到MySQL的测试也挺必要的,于是写下这篇记录一下.如果不知道怎么下载和安装,可以看一下上一篇关于JMeter的文章,地址是:ht ...
- ES6中的数组方法扩展
上一篇文章小编简单介绍了在ES6中,一些常用的方法和一些简单的应用,在这篇文章中,小编将针对ES6中数组常用方法进行扩展,相信经过这篇文章之后,每一位小伙伴下班时间会有所提前,就算从原来的996变成9 ...
- [论文阅读笔记] Adversarial Mutual Information Learning for Network Embedding
[论文阅读笔记] Adversarial Mutual Information Learning for Network Embedding 本文结构 解决问题 主要贡献 算法原理 实验结果 参考文献 ...
- android小技巧之点击两次退出活动
通常在主活动中可以设置连击退出程序,下面通过代码来实现这一功能: @Override//按两次back键退出public boolean onKeyDown(int keyCode, KeyEvent ...
- 65.QT-UDP组播实现多人共享桌面(同时支持收发显示)
这里我们只是简单学习下通过udp组播如何共享桌面demo.帧率上面比较低,毕竟没有用推流,只是简单的将图片发送到组播地址,而加入组播地址的客户端去取数据显示而已. 主要是为了学习UDP知识而写的,真的 ...
- external-attacher源码分析(2)-核心处理逻辑分析
kubernetes ceph-csi分析目录导航 基于tag v2.1.1 https://github.com/kubernetes-csi/external-attacher/releases/ ...
- SpringBoot | 1.3 约定编程Spring AOP
前言 前面聊过Spring的一个很重要的概念,IoC控制反转,接下来就是AOP了: 1. AOP切面编程 面向切面编程,是利用AOP可以对业务逻辑的各个部分进行隔离,从而使得业务逻辑各部分之间的耦合度 ...
- php+redis实现全页缓存系统
php redis 实现全页缓存系统之前的一个项目说的一个功能,需要在后台预先存入某个页面信息放到数据库,比如app的注册协议,用户协议,这种.然后在写成一个php页面,app在调用接口的时候访问这个 ...
- HADOOP及SPARK安装步骤及问题解决
说明:主节点IP:192.168.35.134 主机名:master 从节点slave1 IP: 192.168.35.135 主机名:slave1 从节点slave2 IP: 192.168 ...
- Leetcode No.53 Maximum Subarray(c++实现)
1. 题目 1.1 英文题目 Given an integer array nums, find the contiguous subarray (containing at least one nu ...