react-jinke-music-player 没有设置自动播放,导致每次更新组件都不会播放怎么办
时间: 2024-05-09 11:15:56 浏览: 115
react-music-player:React,TS的音乐播放插件,歌词同步功能,适配PC和移动端;一个带有React和Typescript的音乐播放器,可用于手机和PC
3星 · 编辑精心推荐
你可以在 `AudioPlayer` 组件的 `componentDidUpdate` 生命周期中添加自动播放的代码逻辑,例如:
```javascript
componentDidUpdate(prevProps) {
if (prevProps.audioLists !== this.props.audioLists) {
this.setState({
audioLists: this.props.audioLists
});
}
if (this.state.isPlay === true && this.audio.current.paused) {
this.audio.current.play();
}
}
```
在更新后检查 `isPlay` 状态和 `audio` 元素是否暂停,如果是,则调用 `play()` 方法来自动播放音乐。记得在 `constructor` 中绑定 `audio` 元素的 `ref`。
```javascript
constructor(props) {
super(props);
this.audio = React.createRef();
// ...
}
render() {
return (
<div>
<audio ref={this.audio} />
// ...
</div>
);
}
```
这样每次更新组件后都会自动播放音乐了。
阅读全文