微信小程序把玩(二十七)audio组件
博客专区 > Mr韦淋 的博客 > 博客详情
微信小程序把玩(二十七)audio组件
Mr韦淋 发表于5个月前
微信小程序把玩(二十七)audio组件
  • 发表于 5个月前
  • 阅读 2
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 十分钟定制你的第一个小程序>>>   

这里写图片描述

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

主要属性:

这里写图片描述
这里写图片描述

这里写图片描述

这里写图片描述

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
    }
  })
}
})

共有 人打赏支持
粉丝 3
博文 80
码字总数 23114
×
Mr韦淋
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: