Detaillierte Erläuterung der Videokomponente des WeChat-Applets

高洛峰
Freigeben: 2017-02-20 14:09:47
Original
2133 Leute haben es durchsucht

In diesem Artikel werden hauptsächlich relevante Informationen zur detaillierten Erklärung der Videokomponente des WeChat-Applets vorgestellt. Freunde in Not können sich auf die

Hauptattribute beziehen:

微信小程序 video组件详解

Effektbild:

微信小程序 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>
Nach dem Login kopieren

js:

Page({
 data: {
  src: &#39;&#39;
 },
 /**
  * 打开本地视频
  */
 bindButtonTap: function() {
  var that = this
  //拍摄视频或从手机相册中选视频
  wx.chooseVideo({
   //album 从相册选视频,camera 使用相机拍摄,默认为:[&#39;album&#39;, &#39;camera&#39;]
   sourceType: [&#39;album&#39;, &#39;camera&#39;],
   //拍摄视频最长拍摄时间,单位秒。最长支持60秒
   maxDuration: 60,
   //前置或者后置摄像头,默认为前后都有,即:[&#39;front&#39;, &#39;back&#39;]
   camera: [&#39;front&#39;,&#39;back&#39;],
   //接口调用成功,返回视频文件的临时文件路径,详见返回参数说明
   success: function(res) {
    console.log(res.tempFilePaths[0])
    that.setData({
     src: res.tempFilePaths[0]
    })
   }
  })
 },
 /**
  * 当发生错误时触发error事件,event.detail = {errMsg: &#39;something wrong&#39;}
  */
 videoErrorCallback: function(e) {
  console.log(&#39;视频错误信息:&#39;)
  console.log(e.detail.errMsg)
 }
})
Nach dem Login kopieren

Vielen Dank fürs Lesen, ich hoffe, es kann Ihnen helfen, vielen Dank für Ihre Unterstützung dieser Seite!

Ausführlichere Erläuterungen zu WeChat-Applet-Videokomponenten und zugehörigen Artikeln finden Sie auf der chinesischen PHP-Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!