微信小程序 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优化技巧(文件瘦身篇)
Jan 28 Javascript
javascript之bind使用介绍
Oct 09 Javascript
jquery拖动插件(jquery.drag)使用介绍
Jun 18 Javascript
javascript 数字格式化输出的实现代码
Dec 10 Javascript
MVVM模式中ViewModel和View、Model有什么区别?
Jun 19 Javascript
基于原生js淡入淡出函数封装(兼容IE)
Oct 20 Javascript
解决vue2中使用axios http请求出现的问题
Mar 05 Javascript
分析javascript原型及原型链
Mar 18 Javascript
Vue仿支付宝支付功能
May 25 Javascript
Vue常用指令详解分析
Aug 19 Javascript
Vue根据条件添加click事件的方式
Nov 09 Javascript
Typescript3.9 常用新特性一览(推荐)
May 14 Javascript
老生常谈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批量采集下载美女图片的实现代码
2013/06/03 PHP
PHP设计模式之模板模式定义与用法详解
2018/12/20 PHP
使用Modello编写JavaScript类
2006/12/22 Javascript
JavaScript isPrototypeOf和hasOwnProperty使用区别
2010/03/04 Javascript
文本框(input)获取焦点(onfocus)时样式改变的示例代码
2014/01/10 Javascript
jquery中$(#form :input)与$(#form input)的区别
2014/08/18 Javascript
Javascript 数组排序详解
2014/10/22 Javascript
详解jQuery中的deferred对象的使用(一)
2016/05/27 Javascript
jquery实现网页定位导航
2016/08/23 Javascript
浅谈原生JS中的延迟脚本和异步脚本
2017/07/12 Javascript
JavaScript实现简单图片轮播效果
2017/08/21 Javascript
nodejs创建简易web服务器与文件读写的实例
2017/09/07 NodeJs
webpack打包并将文件加载到指定的位置方法
2018/02/22 Javascript
微信小程序之swiper轮播图中的图片自适应高度的方法
2018/04/23 Javascript
React从react-router路由上做登陆验证控制的方法
2018/05/10 Javascript
微信小程序扫描二维码获取信息实例详解
2019/05/07 Javascript
layui 动态设置checbox 选中状态的例子
2019/09/02 Javascript
[00:47]DOTA2荣耀之路6:天火,天火!
2018/05/30 DOTA
python实现画圆功能
2018/01/25 Python
在ubuntu16.04中将python3设置为默认的命令写法
2018/10/31 Python
在matplotlib的图中设置中文标签的方法
2018/12/13 Python
ActiveMQ:使用Python访问ActiveMQ的方法
2019/01/30 Python
python下载微信公众号相关文章
2019/02/26 Python
Python Django简单实现session登录注销过程详解
2019/08/06 Python
python框架flask入门之路由及简单实现方法
2020/06/07 Python
英国演唱会订票网站:Ticket Selection
2018/03/27 全球购物
巴西备受欢迎的服装和生活方式品牌:FARM Rio
2020/02/04 全球购物
欧姆龙医疗保健与医疗产品:Omron Healthcare
2020/02/10 全球购物
财务管理专业毕业生求职信范文
2013/09/21 职场文书
三年级学生评语
2014/04/23 职场文书
我的祖国演讲稿
2014/05/04 职场文书
群众路线教育查摆剖析材料
2014/10/10 职场文书
学生会感恩节活动方案
2014/10/11 职场文书
2015年社区统计工作总结
2015/04/21 职场文书
陶瓷类经典广告语集锦
2019/10/25 职场文书
Nginx的反向代理实例详解
2021/03/31 Servers