微信小程序云开发-云存储-下载并打开文件文件(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)注册账号之后会有一个 ...
随机推荐
- 实时双频Wi-Fi如何实现下一代车内连接
实时双频Wi-Fi如何实现下一代车内连接 How real simultaneous dual band Wi-Fi enables next-generation in-vehicle connec ...
- Excel创建手机号1000个
一.输入手机号15900000001,并且选择 二.选中这一列 三.按住Ctrl,鼠标选中创建手机号,取消选中的状态 四.开始-填充 五.选择序列 六.选择列-自动填充-点击确定 七.查看结果,生成成 ...
- Redis系列(二):常用操作
一.数据类型 如果学过数据结构就会知道,操作往往是在特定的数据结构上的,不同的数据结构就会有不同的操作,Redis支持以下的数据类型: 字符串(Strings),列表(Lists),集合(Sets), ...
- 深入理解JVM,7种垃圾收集器,看完我跪了
如果说收集算法是内存回收的方法论,那么垃圾收集器就是内存回收的具体实现.Java虚拟机规范中对垃圾收集器应该如何实现并没有任何规定,因此不同的厂商.版本的虚拟机所提供的垃圾收集器都可能会有很大差别,并 ...
- ES6中的Module与Interator
小编今天在用Vue做项目的时候,发现组件中有import和export,刚好今天看到相关的语法介绍和一些实例,下面小编就和大家一起进步.对于模块化规范,在es6出现之前,有以下三种规范,分别是Comm ...
- Project Reactor 响应式编程
目录 一. 什么是响应式编程? 二. Project Reactor介绍 三. Reactor核心概念 Flux 1. just() 2. fromArray(),fromIterable()和 fr ...
- rabbitmqctl 命令整理
虽然还有http 接口.web admin组件可以进行管理,但是rabbitmqctl 基本包含了 rabbitmq 的全部管理功能,更为全面. 所以将其使用方法总结于此. 一,命令格式 rabbit ...
- Hadoop - 彻底解决警告:WARN util.NativeCodeLoader: Unable to load native-hadoop library for your platform...
目录 1 - 在日志配置文件中忽略警告 - 有效 2 - 指定本地库的路径 - 无效 3 - 不使用 Hadoop 本地库 - 无效 4 - 替换 Hadoop 本地库 - 有效 5 - 根据源码,编 ...
- 【.NET 与树莓派】TM1638 模块的按键扫描
上一篇水文中,老周马马虎虎地介绍 TM1638 的数码管驱动,这个模块除了驱动 LED 数码管,还有一个功能:按键扫描.记得前面的水文中老周写过一个 16 个按键的模块.那个是我们自己写代码去完成键扫 ...
- Linux中curl的用法
一.简介:在Linux中curl是一个利用URL规则在命令行下工作的文件传输工具,是一款强大的http命令行工具.支持文件的上传和下载,是综合传输工具. 二.语法:curl [option] [url ...