微信小程序 video組件詳解
更新時間:2016年10月25日 10:07:10 投稿:lqh
這篇文章主要介紹了微信小程序 video組件詳解的相關資料,需要的朋友可以參考下
主要屬性:

效果圖:

ml:
<View>1.播放網絡視頻</View>
<view >
<video style="width: 100%;height=400px;margin:1px;" src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400" binderror="videoErrorCallback"></video>
</view>
<View>2.播放本地視頻</View>
<view style="display: flex;flex-direction: column;">
<video style="width: 100%;height=400px;margin:1px;" src="{{src}}"></video>
<view class="btn-area">
<button bindtap="bindButtonTap">打開本地視頻</button>
</view>
</view>
js:
Page({
data: {
src: ''
},
/**
* 打開本地視頻
*/
bindButtonTap: function() {
var that = this
//拍攝視頻或從手機相冊中選視頻
wx.chooseVideo({
//album 從相冊選視頻,camera 使用相機拍攝,默認為:['album', 'camera']
sourceType: ['album', 'camera'],
//拍攝視頻最長拍攝時間,單位秒。最長支持60秒
maxDuration: 60,
//前置或者后置攝像頭,默認為前后都有,即:['front', 'back']
camera: ['front','back'],
//接口調用成功,返回視頻文件的臨時文件路徑,詳見返回參數說明
success: function(res) {
console.log(res.tempFilePaths[0])
that.setData({
src: res.tempFilePaths[0]
})
}
})
},
/**
* 當發(fā)生錯誤時觸發(fā)error事件,event.detail = {errMsg: 'something wrong'}
*/
videoErrorCallback: function(e) {
console.log('視頻錯誤信息:')
console.log(e.detail.errMsg)
}
})
感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持!
相關文章
微信小程序 時間格式化(util.formatTime(new Date))詳解
這篇文章主要介紹了微信小程序 時間格式化(util.formatTime(new Date))詳解的相關資料,這里附實例,一目了然很容易解決,需要的朋友可以參考下2016-11-11
微信小程序 出現47001 data format error原因解決辦法
這篇文章主要介紹了微信小程序 出現47001 data format error原因解決辦法的相關資料,需要的朋友可以參考下2017-03-03
ant-design的upload組件中實現粘貼上傳實例詳解
這篇文章主要為大家介紹了ant-design的upload組件中實現粘貼上傳實例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-05-05

