微信小程序中 Video API 的详细解析

why 526 2024-08-19

这篇文章主要介绍了 微信小程序 video api实例详解,需要的朋友可以参考下


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

主要属性:

wx.chooseVideo(object)

image.png

成功之后返回参数

image.png

wxml


1

2

3

<button type="primary" bindtap="listenerBtnOpenVideo">打开视频</button>

<!--默认视频组件是隐藏的-->

<video src="{{videoSource}}" hidden="{{videoHidden}}" style="width: 100%; height: 100%"/>


js


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

Page({

 data:{

  // text:"这是一个页面"

  videoSource: &#39;&#39;,

  videoHidden: true

 },

 

 listenerBtnOpenVideo: function() {

   var that = this;

   wx.chooseVideo({

     //相机和相册

     sourceType: [&#39;album&#39;, &#39;camera&#39;],

     //录制视频最大时长

     maxDuration: 60,

     //摄像头

     camera: [&#39;front&#39;, &#39;back&#39;],

     //这里返回的是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(){

  // 页面关闭

 }

})


以上就是本文的全部内容,希望对大家的学习有所帮助。


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:微信小程序里网络请求的 post 请求与 get 请求解析
下一篇:微信小程序里购物车功能的具体实现办法
相关文章

 发表评论

暂时没有评论,来抢沙发吧~