一、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. 实时双频Wi-Fi如何实现下一代车内连接

    实时双频Wi-Fi如何实现下一代车内连接 How real simultaneous dual band Wi-Fi enables next-generation in-vehicle connec ...

  2. Excel创建手机号1000个

    一.输入手机号15900000001,并且选择 二.选中这一列 三.按住Ctrl,鼠标选中创建手机号,取消选中的状态 四.开始-填充 五.选择序列 六.选择列-自动填充-点击确定 七.查看结果,生成成 ...

  3. Redis系列(二):常用操作

    一.数据类型 如果学过数据结构就会知道,操作往往是在特定的数据结构上的,不同的数据结构就会有不同的操作,Redis支持以下的数据类型: 字符串(Strings),列表(Lists),集合(Sets), ...

  4. 深入理解JVM,7种垃圾收集器,看完我跪了

    如果说收集算法是内存回收的方法论,那么垃圾收集器就是内存回收的具体实现.Java虚拟机规范中对垃圾收集器应该如何实现并没有任何规定,因此不同的厂商.版本的虚拟机所提供的垃圾收集器都可能会有很大差别,并 ...

  5. ES6中的Module与Interator

    小编今天在用Vue做项目的时候,发现组件中有import和export,刚好今天看到相关的语法介绍和一些实例,下面小编就和大家一起进步.对于模块化规范,在es6出现之前,有以下三种规范,分别是Comm ...

  6. Project Reactor 响应式编程

    目录 一. 什么是响应式编程? 二. Project Reactor介绍 三. Reactor核心概念 Flux 1. just() 2. fromArray(),fromIterable()和 fr ...

  7. rabbitmqctl 命令整理

    虽然还有http 接口.web admin组件可以进行管理,但是rabbitmqctl 基本包含了 rabbitmq 的全部管理功能,更为全面. 所以将其使用方法总结于此. 一,命令格式 rabbit ...

  8. Hadoop - 彻底解决警告:WARN util.NativeCodeLoader: Unable to load native-hadoop library for your platform...

    目录 1 - 在日志配置文件中忽略警告 - 有效 2 - 指定本地库的路径 - 无效 3 - 不使用 Hadoop 本地库 - 无效 4 - 替换 Hadoop 本地库 - 有效 5 - 根据源码,编 ...

  9. 【.NET 与树莓派】TM1638 模块的按键扫描

    上一篇水文中,老周马马虎虎地介绍 TM1638 的数码管驱动,这个模块除了驱动 LED 数码管,还有一个功能:按键扫描.记得前面的水文中老周写过一个 16 个按键的模块.那个是我们自己写代码去完成键扫 ...

  10. Linux中curl的用法

    一.简介:在Linux中curl是一个利用URL规则在命令行下工作的文件传输工具,是一款强大的http命令行工具.支持文件的上传和下载,是综合传输工具. 二.语法:curl [option] [url ...