微信小程序实现文件预览


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 一些用法小结
Sep 11 Javascript
jquery子元素过滤选择器使用示例
Jun 24 Javascript
PHPExcel中的一些常用方法汇总
Jan 23 Javascript
详细解读AngularJS中的表单验证编程
Jun 19 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
Sep 10 Javascript
基于JavaScript实现轮播图代码
Jul 14 Javascript
js实现刷新页面后回到记录时滚动条的位置【两种方案可选】
Dec 12 Javascript
Redux实现组合计数器的示例代码
Jul 04 Javascript
vue自定义移动端touch事件之点击、滑动、长按事件
Jul 10 Javascript
vue router 配置路由的方法
Jul 26 Javascript
vue中datepicker的使用教程实例代码详解
Jul 08 Javascript
vue实现全屏滚动效果(非fullpage.js)
Mar 07 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实现文件下载简单示例(代码实现文件下载)
2014/03/10 PHP
php实现随机生成易于记忆的密码
2015/06/19 PHP
搜索附近的人PHP实现代码
2018/02/11 PHP
PHP按一定比例压缩图片的方法
2018/10/12 PHP
解决 firefox 不支持 document.all的方法
2007/03/12 Javascript
AngularJS HTML编译器介绍
2014/12/06 Javascript
jQuery中prevUntil()方法用法实例
2015/01/08 Javascript
EasyUI在表单提交之前进行验证的实例代码
2016/06/24 Javascript
Bootstrap轮播插件中图片变形的终极解决方案 使用jqthumb.js
2016/07/10 Javascript
微信小程序 图片加载(本地,网路)实例详解
2017/03/10 Javascript
node.js 抓取代理ip实例代码
2017/04/30 Javascript
详解使用nodeJs安装Vue-cli
2017/05/17 NodeJs
AngularJS select加载数据选中默认值的方法
2018/02/28 Javascript
video.js 实现视频只能后退不能快进的思路详解
2018/08/09 Javascript
vue源码nextTick使用及原理解析
2019/08/13 Javascript
ElementUI中el-tree节点的操作的实现
2020/02/27 Javascript
Vue的v-model的几种修饰符.lazy,.number和.trim的用法说明
2020/08/05 Javascript
Javascript数组及类数组相关原理详解
2020/10/29 Javascript
Python实现TCP协议下的端口映射功能的脚本程序示例
2016/06/14 Python
Python实现的大数据分析操作系统日志功能示例
2019/02/11 Python
python:动态路由的Flask程序代码
2019/11/22 Python
Python实现子类调用父类的初始化实例
2020/03/12 Python
Python Selenium安装及环境配置的实现
2020/03/17 Python
浅谈python 中的 type(), dtype(), astype()的区别
2020/04/09 Python
python matplotlib.pyplot.plot()参数用法
2020/04/14 Python
Python分析微信好友性别比例和省份城市分布比例的方法示例【基于itchat模块】
2020/05/29 Python
python实现批处理文件
2020/07/28 Python
Python基于unittest实现测试用例执行
2020/11/25 Python
html5表单及新增的改良元素详解
2016/06/07 HTML / CSS
Jeep牧马人、切诺基和自由人零配件:4 Wheel Drive Hardware
2017/07/02 全球购物
西班牙太阳镜品牌:Hawkers
2018/03/11 全球购物
美国NBA官方商店:NBA Store
2019/04/12 全球购物
男性健康日的活动方案
2014/08/18 职场文书
大学团日活动新闻稿
2014/09/10 职场文书
党风廉正建设责任书
2015/01/29 职场文书
交通事故赔偿起诉书
2015/05/20 职场文书