小编aro*_*207的帖子

如何一次播放数组中的一首歌曲反应js

我正在构建一个简单的音乐播放器,但失败的是尝试一次执行数组中的一项。我正在使用 React H5 音频播放器包来播放音乐。我目前正在映射所有歌曲,但我不知道如何一次正确地播放一首。我很感激任何帮助。我已经被这个问题困扰了好几天了。


import { SongContext } from '../../SongContext';

import AudioPlayer from 'react-h5-audio-player';
import 'react-h5-audio-player/lib/styles.css';

import './Player.css';

const Player = () => {
    const { songs } = useContext(SongContext);

    return (
        <>
            {songs.length > 0 &&
                songs.map((song) => (
                    <div className="player" key={song.id}>
                        <AudioPlayer
                            // autoPlay
                            // src={song.preview}
                            showJumpControls={false}
                            customVolumeControls={[]}
                            customAdditionalControls={[]}
                            onPlay={() => console.log('playing')}
                        />
                    </div>
                ))}
        </>
    );
};
export default Player;
Run Code Online (Sandbox Code Playgroud)

javascript arrays mapping reactjs react-hooks

2
推荐指数
1
解决办法
1460
查看次数

标签 统计

arrays ×1

javascript ×1

mapping ×1

react-hooks ×1

reactjs ×1