• 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧

有没有办法与

JavaScript 来源:Dawn17 3次浏览

我正在创建一个简单的反应应用程序,需要使用给定的URL播放音乐。 我试图用硬编码的音乐网址进行测试,并使用<audio>标签来播放音乐,就像我们在HTML中一样。有没有办法与<audio>一起播放音乐?

class Music extends React.Component { 
    render() { 

    return (
     <span> 

     <audio src="URL"> 
    </span> 

    ) 
    } 
} 

但是这不会编译。在反应应用程序中播放音乐的最简单方法是什么?

===========解决方案如下:

其中一种解决方案可以使用HTML5 Audio。创建new Audio对象,并使用自定义按钮控制该对象Play/Pause

基本例如:

您也可以使用addEventListener控制和处理Play/Pause

播放:

this.audio.addEventListener('play',() => { 
    this.setState({ 
    play: true, 
    pause: false, 
    }) 
}); 

暂停:

this.audio.addEventListener('pause',() => { 
    this.setState({ 
    play: false, 
    pause: true, 
    }) 
}); 

文档和示例:

Audio/Video Event Listener

MDN HTML5 Audio

重要提示:

HTML5 Audio元素没有一个stop()功能,所以暂停后音频()仍在加载(缓冲背景)。

这是一个解决方案: HTML5 Video: Force abort of buffering

的jsfiddle: https://jsfiddle.net/y2j0vzbe/

希望这可以帮助。


版权声明:本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系管理员进行删除。
喜欢 (0)