微信小程序 Video API实例详解


Posted in Javascript onOctober 02, 2016

微信小程序 Video API实例详解

电脑端不能测试拍摄功能只能测试选择视频功能,好像只支持mp4格式,值得注意的是成功之后返回的临时文件路径是个列表tempFilePaths而不是tempFilePath文档写的有点问题。

主要属性:

wx.chooseVideo(object)

微信小程序 Video API实例详解

成功之后返回参数

微信小程序 Video API实例详解

wxml

<button type="primary" bindtap="listenerBtnOpenVideo">打开视频</button>
<!--默认视频组件是隐藏的-->
<video src="{{videoSource}}" hidden="{{videoHidden}}" style="width: 100%; height: 100%"/>

js

Page({
 data:{
  // text:"这是一个页面"
  videoSource: '',
  videoHidden: true
 },

 listenerBtnOpenVideo: function() {
   var that = this;
   wx.chooseVideo({
     //相机和相册
     sourceType: ['album', 'camera'],
     //录制视频最大时长
     maxDuration: 60,
     //摄像头
     camera: ['front', 'back'],
     //这里返回的是tempFilePaths并不是tempFilePath
     success: function(res){
      console.log(res.tempFilePaths[0])
       that.setData({
         videoSource: res.tempFilePaths[0],
         videoHidden: false
       })
     },
     fail: function(e) {
      console.log(e)
     }
   })
 },

 onLoad:function(options){
  // 页面初始化 options为页面跳转所带来的参数
 },
 onReady:function(){
  // 页面渲染完成
 },
 onShow:function(){
  // 页面显示
 },
 onHide:function(){
  // 页面隐藏
 },
 onUnload:function(){
  // 页面关闭
 }
})

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
javascript String 的扩展方法集合
Jun 01 Javascript
javascript 获取元素位置的快速方法 getBoundingClientRect()
Nov 26 Javascript
对xmlHttp对象的理解
Jan 17 Javascript
window.open以post方式将内容提交到新窗口
Dec 26 Javascript
JavaScript对象学习小结
Sep 02 Javascript
javascript获取以及设置光标位置
Feb 16 Javascript
jQuery常见面试题之DOM操作详析
Jul 05 jQuery
详解JS构造函数中this和return
Sep 16 Javascript
详解react阻止无效重渲染的多种方式
Dec 11 Javascript
详解小程序云开发数据库
May 20 Javascript
利用不到200行代码写一款属于你自己的js类库
Jul 08 Javascript
详解如何在vue+element-ui的项目中封装dialog组件
Dec 11 Vue.js
老生常谈JavaScript中的this关键字
Oct 01 #Javascript
ES6新特征数字、数组、字符串
Oct 01 #Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 #Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
Oct 01 #Javascript
javascript代码调试之console.log 用法图文详解
Sep 30 #Javascript
JS实现表单多文件上传样式美化支持选中文件后删除相关项
Sep 30 #Javascript
微信小程序 Audio API详解及实例代码
Sep 30 #Javascript
You might like
PHP clearstatcache()函数详解
2010/03/02 PHP
xheditor与validate插件冲突的解决方案
2010/04/15 Javascript
JS中引用百度地图并将百度地图的logo和信息去掉
2013/09/29 Javascript
JS获取键盘上任意按键的值(实例代码)
2013/11/12 Javascript
如何减少浏览器的reflow和repaint
2015/02/26 Javascript
纯JS实现旋转图片3D展示效果
2015/04/12 Javascript
jquery实现实时改变网页字体大小、字体背景色和颜色的方法
2015/08/05 Javascript
JavaScript实现复制内容到粘贴板代码
2016/03/31 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
node+express制作爬虫教程
2016/11/11 Javascript
javascript中Number的方法小结
2016/11/21 Javascript
js仿百度音乐全选操作
2017/01/13 Javascript
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
2017/08/01 jQuery
vue.js系列中的vue-fontawesome使用
2018/02/10 Javascript
QQ跳转支付宝并自动领红包脚本(最新)
2018/06/22 Javascript
JS基于封装函数实现的表格分页完整示例
2018/06/26 Javascript
vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法
2019/04/17 Javascript
vue 获取url里参数的两种方法小结
2020/11/12 Javascript
[45:59]EG vs OG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python 实现UTC时间加减的方法
2018/12/31 Python
python内存动态分配过程详解
2019/07/15 Python
pandas中的数据去重处理的实现方法
2020/02/10 Python
pytorch VGG11识别cifar10数据集(训练+预测单张输入图片操作)
2020/06/24 Python
欧洲最大的拼图游戏商店:JigsawPuzzle.co.uk
2018/07/04 全球购物
西部世纪面试题
2014/12/05 面试题
人口与计划生育目标管理责任书
2014/07/29 职场文书
家具商场的活动方案
2014/08/16 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
工作骂脏话检讨书
2014/10/05 职场文书
合同和协议有什么区别?
2014/10/08 职场文书
2014小学数学教研组工作总结
2014/12/06 职场文书
伏羲庙导游词
2015/02/09 职场文书
幼儿园卫生保健制度
2015/08/05 职场文书
小学语文教师研修感悟
2015/11/18 职场文书
js中Object.create实例用法详解
2021/10/05 Javascript
Android自定义ScrollView实现阻尼回弹
2022/04/01 Java/Android