微信小程序把玩(二十七)audio组件

发布时间:2023-08-23 13:00

微信小程序把玩(二十七)audio组件_第1张图片

音频播放已经封装的很好!只需配合属性设置即可! (method和data配合使用)

主要属性:

微信小程序把玩(二十七)audio组件_第2张图片
微信小程序把玩(二十七)audio组件_第3张图片

微信小程序把玩(二十七)audio组件_第4张图片

微信小程序把玩(二十七)audio组件_第5张图片

wxml

<audio
    action="{{action}}"
    src='http://sc1.111ttt.com/2016/1/09/26/202261732256.mp3'
    poster= 'http://avatar.csdn.net/E/3/9/1_u014360817.jpg'
    controls="true"
    name="钢琴曲"
    author="不详"/>

<button type="primary" bindtap="audioPlay">播放button>
<button type="primary" bindtap="audioPause">暂停button>

<button type="primary" bindtap="audioPlaybackRateNormal">调为1倍速button>

<button type="primary" bindtap="audioPlaybackRateSlowDown">调为0.5倍速button>

js

Page({
  data:{
    // text:"这是一个页面"
    action: {
      method: ''
    }
  },

  audioPlay:function() {
    this.setData({
     action: {
       method: 'play'
     }
   })
  },
 audioPause:function(){
   this.setData({
     action: {
       method: 'pause'
     }
   })
 },
 audioPlaybackRateNormal:function() {
   this.setData({
     action:{
       method: 'setPlaybackRate',
       data: 1
     }
   })
 },
audioPlaybackRateSlowDown:function() {
  this.setData({
    action: {
      method: 'setPlaybackRate',
      data: 0.5
    }
  })
}
})

ItVuer - 免责声明 - 关于我们 - 联系我们

本网站信息来源于互联网,如有侵权请联系:561261067@qq.com

桂ICP备16001015号