微信小程序实现文件预览


Posted in Javascript onOctober 22, 2020

微信小程序的文件预览,供大家参考,具体内容如下

微信小程序的文件预览需要先使用wx.downloadFile下载文件,然后使用下载文件的临时路径通过wx.openDocument进行文件的

预览

wxml代码:

<button bindtap='preview'>简历预览</button>

js代码:

//简历预览
 preview: function () {
 var that = this;
 console.log("简历预览")
 
//这里的value是先在data里面初始化,然后我根据用户切换单选框,获取的简历文件的主键id
 console.log(this.data.value)
 var id = that.data.value;

 if (id == "") {
 wx.showModal({
 title: '',
 content: '请选择一份简历',
 showCancel: false,
 confirmColor: "#FFB100"
 })
 } else {

 //先通过简历的主键id,查询简历路径(大家可以根据自己的需求来传数据)
 wx.request({
 url: app.globalData.url + "/api/interview/queryFilePath",
 data: {
  id: id
 },
 method: 'POST',
 header: { "content-type": "application/x-www-form-urlencoded" },
 success: function (res) {
  console.log(res.data)
  that.setData({
  path: res.data.path,
  type: res.data.type
  })
  //下载简历
  wx.downloadFile({
  url: app.globalData.url + that.data.path,
  success: function (res) {
  var filePath = res.tempFilePath
  console.log(filePath)

  //预览简历
  wx.openDocument({
  filePath: filePath,
  fileType: that.data.type,
  success: function (res) {
   console.log("打开文档成功")
   console.log(res);
  },
  fail: function (res) {
   console.log("fail");
   console.log(res)
  },
  complete: function (res) {
   console.log("complete");
   console.log(res)
  }
  })
  },
  fail: function (res) {
  console.log('fail')
  console.log(res)
  },
  complete: function (res) {
  console.log('complete')
  console.log(res)
  }
  })
 }
 })
 }
 },

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery判断单个复选框是否被选中的代码
Sep 03 Javascript
css transform 3D幻灯片特效实现步骤解读
Mar 27 Javascript
解决js函数闭包内存泄露问题的办法
Jan 25 Javascript
BootStrap 超链接变按钮的实现方法
Sep 25 Javascript
Angular的模块化(代码分享)
Dec 26 Javascript
老生常谈angularjs中的$state.go
Apr 24 Javascript
详解vue2.0的Element UI的表格table列时间戳格式化
Jun 13 Javascript
关于meta viewport中target-densitydpi属性详解(推荐)
Aug 18 Javascript
详解vue.js之props传递参数
Dec 12 Javascript
vue单页面应用打开新窗口显示跳转页面的实例
Sep 21 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
Jun 17 Javascript
深入理解 TypeScript Reflect Metadata
Dec 12 Javascript
解决新建一个vue项目过程中遇到的问题
Oct 22 #Javascript
解决vue安装less报错Failed to compile with 1 errors的问题
Oct 22 #Javascript
vue实现下拉菜单树
Oct 22 #Javascript
Javascript柯里化实现原理及作用解析
Oct 22 #Javascript
Node.js fs模块原理及常见用途
Oct 22 #Javascript
使用vue构建多页面应用的示例
Oct 22 #Javascript
vue 单页应用和多页应用的优劣
Oct 22 #Javascript
You might like
PHP下10件你也许并不了解的事情
2008/09/11 PHP
php usort 使用用户自定义的比较函数对二维数组中的值进行排序
2017/05/02 PHP
阿里云PHP SMS短信服务验证码发送方法
2017/07/11 PHP
菜鸟javascript基础资料整理3 正则
2010/12/06 Javascript
JavaScript中使用document.write向页面输出内容实例
2014/10/16 Javascript
Boostrap入门准备之border box
2016/05/09 Javascript
Vue.js一个文件对应一个组件实践
2016/10/27 Javascript
使用JS模拟锚点跳转的实例
2018/02/01 Javascript
详解给Vue2路由导航钩子和axios拦截器做个封装
2018/04/10 Javascript
Layer弹出层动态获取数据的方法
2018/08/20 Javascript
Node.js中package.json中库的版本号(~和^)
2019/04/02 Javascript
前端路由&amp;webpack基础配置详解
2019/06/10 Javascript
通过实例解析json与jsonp原理及使用方法
2020/09/27 Javascript
[43:51]2014 DOTA2国际邀请赛中国区预选赛 Dream Times VS TongFu
2014/05/22 DOTA
[01:05:24]Ti4 冒泡赛第二天 iG vs NEWBEE 3
2014/07/15 DOTA
Web服务器框架 Tornado简介
2014/07/16 Python
python使用PIL缩放网络图片并保存的方法
2015/04/24 Python
Python工厂函数用法实例分析
2018/05/14 Python
python 实现查询Neo4j多节点的多层关系
2019/12/23 Python
Python列表解析操作实例总结
2020/02/26 Python
利用Python脚本批量生成SQL语句
2020/03/04 Python
Python生成pdf目录书签的实例方法
2020/10/29 Python
pycharm中leetcode插件使用图文详解
2020/12/07 Python
python 合并多个excel中同名的sheet
2021/01/22 Python
css3新单位vw、vh的使用教程
2018/03/23 HTML / CSS
私有程序集与共享程序集有什么区别
2013/04/05 面试题
当x.equals(y)等于true时,x.hashCode()与y.hashCode()可以不相等,这句话对不对
2015/05/02 面试题
岗位职责风险防控
2014/02/18 职场文书
模特职业生涯规划范文
2014/02/26 职场文书
服装仓管员岗位职责
2014/06/17 职场文书
2014年煤矿工作总结
2014/11/24 职场文书
幼儿园教师自荐书
2015/03/06 职场文书
2015年前台文员工作总结
2015/05/18 职场文书
被告代理词范文
2015/05/25 职场文书
送给小学生的暑假礼物!小学生必背99首古诗
2019/07/02 职场文书
spring boot实现文件上传
2022/08/14 Java/Android