微信小程序实现文件预览


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 相关文章推荐
javascript学习笔记(十六) 系统对话框(alert、confirm、prompt)
Jun 20 Javascript
Js-$.extend扩展方法使方法参数更灵活
Jan 15 Javascript
怎么清空javascript数组
May 11 Javascript
关于删除时的提示处理(确定删除吗)
Nov 03 Javascript
Extjs Label的 fieldLabel和html属性值对齐的方法
Jun 15 Javascript
表单验证正则表达式实例代码详解
Nov 09 Javascript
底部悬浮通栏可以关闭广告位的实现方法
Jun 01 Javascript
详解Angular2组件之间如何通信
Jun 22 Javascript
JavaScript实现表单注册、表单验证、运算符功能
Oct 15 Javascript
vue elementUI table 自定义表头和行合并的实例代码
May 22 Javascript
jquery添加div实现消息聊天框
Feb 08 jQuery
vue 使用async写数字动态加载效果案例
Jul 18 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
我的论坛源代码(一)
2006/10/09 PHP
基于jQuery的公告无限循环滚动实现代码
2012/05/11 Javascript
Js参数值中含有单引号或双引号问题的解决方法
2013/11/06 Javascript
JS+DIV实现鼠标划过切换层效果的实例代码
2013/11/26 Javascript
JS中使用FormData上传文件、图片的方法
2016/08/07 Javascript
Javascript循环删除数组中元素的几种方法示例
2017/05/18 Javascript
js的函数的按值传递参数(实例讲解)
2017/11/16 Javascript
Node.Js中实现端口重用原理详解
2018/05/03 Javascript
vue 点击按钮增加一行的方法
2018/09/07 Javascript
vue项目中跳转到外部链接的实例讲解
2018/09/20 Javascript
vue.js实现图书管理功能
2019/09/24 Javascript
vue-router 按需加载 component: () =&gt; import() 报错的解决
2020/09/22 Javascript
python中list常用操作实例详解
2015/06/03 Python
简单上手Python中装饰器的使用
2015/07/12 Python
Python实现简单网页图片抓取完整代码实例
2017/12/15 Python
教你用 Python 实现微信跳一跳(Mac+iOS版)
2018/01/04 Python
python3之模块psutil系统性能信息使用
2018/05/30 Python
python将视频转换为全字符视频
2019/04/26 Python
Python selenium爬取微博数据代码实例
2020/05/22 Python
canvas简易绘图的实现(海绵宝宝篇)
2018/07/04 HTML / CSS
Expedia马来西亚旅游网站:廉价酒店,度假村和航班预订
2016/07/26 全球购物
Notino匈牙利:购买香水和化妆品
2019/04/12 全球购物
英国买鞋网站:Charles Clinkard
2019/11/14 全球购物
weblogic面试题
2016/03/07 面试题
经典c++面试题三
2015/07/08 面试题
几个常见的软件测试问题
2016/09/07 面试题
新闻编辑自荐信
2013/11/03 职场文书
《太阳》教学反思
2014/02/21 职场文书
制药工程专业职业生涯规划范文
2014/03/10 职场文书
普通话宣传标语
2014/06/26 职场文书
2014年作风建设心得体会
2014/10/22 职场文书
2014年社团工作总结范文
2014/11/27 职场文书
2015年派出所工作总结
2015/04/24 职场文书
2016入党积极分子党课培训心得体会
2016/01/06 职场文书
Python排序算法之插入排序及其优化方案详解
2021/06/11 Python
SONY AN-LP1 短波有源天线放大器图
2022/04/05 无线电