要实现的效果,点击一个音频,图像变成播放状态,其他的所有音频都是停放状态,点击同一个音频,音频播放暂停来回切换。
我是用的是github上的react-sound这个库。
example:
render() {
return (
<Sound
url="cool_sound.mp3"
playStatus={Sound.status.PLAYING}
playFromPosition={300 /* in milliseconds */}
onLoading={this.handleSongLoading}
onPlaying={this.handleSongPlaying}
onFinishedPlaying={this.handleSongFinishedPlaying}
/>
);
}
然后自己进行了一些处理,将参数改下就可以了。思路就是:点击一个音频时,让playStatus设置为‘PLAYING’,让其他所有的playStatus设置为‘STOPPED’;点击同一个音频时,将对对应的播放状态设置为对立的状态就可以了(即播放改为暂停,暂停改为播放),具体代码就不粘上了。