react项目 循环播放背景音乐

背景音乐"/>

react项目 循环播放背景音乐

代码简写

let audioArr;
let audioIndex;
export default class IndexLayout extends React.PureComponent {state = {audioUrl: '',};componentDidMount() {this.getAudio();}
// 切换音乐ChangeMusic = (myAudio) => {if(audioArr.length-1<=audioIndex){audioIndex = 0;myAudio.src = audioArr[0].file_url;myAudio.play();}else{audioIndex = ++audioIndex;myAudio.src = audioArr[audioIndex].file_url;myAudio.play()}}// 获取音频getAudio=()=>{this.props.dispatch({type: 'front/getAudio',payload: {}}).then((data)=>{if(data && data.length > 0){audioArr = data;audioIndex = 0;// 音乐播放const myAudio = new Audio()myAudio.preload = true; //// myAudio.controls = true;myAudio.loop = false;myAudio.src = data[0].file_url;// 播完时候播放下一首myAudio.addEventListener('ended', this.ChangeMusic.bind(this, myAudio), false);myAudio.play();document.getElementById("audioBox").appendChild(myAudio);}})};render() {return (<div id='audioBox' />);}
}