Как сделать перелистывание музыки, с помощью useSound
У меня есть текущий трек, и при каждом нажатии я меняю его на следующий, но при этом предыдущий продолжает играть.
function importAll(r) {
return r.keys().map(r);
}
const music = importAll(require.context('../../../music', false, /\.mp3$/)).sort((a, b) => Number(a.slice(0, 2)) - Number(b.slice(0,2)));
const [volume, setVolume] = useState(500)
const [isPlaying, setIsPlaying] = useState(false);
const [antitled, setAntitled] = useState(
[
{obect}
]);
const [n, setN] = useState(0);
const [play, { pause, duration, sound, stop, autoplay}] = useSound(antitled[n].song)
const [time, setTime] = useState({
min: "",
sec: ""
});
const [seconds, setSeconds] = useState();
const [currTime, setCurrTime] = useState({
min: "",
sec: ""
});
useEffect(() => {
if (duration) {
const sec = duration / 1000;
const min = Math.floor(sec / 60);
const secRemain = Math.floor(sec % 60);
setTime({
min: min,
sec: secRemain
});
}
}, [duration]);
useEffect(() => {
const interval = setInterval(() => {
if (sound) {
setSeconds(sound.seek([]));
const min = Math.floor(sound.seek([]) / 60)
const sec = Math.floor(sound.seek([]) % 60)
setCurrTime({
min,
sec
});
}
}, 1000);
if (isPlaying) {
play()
}
return () => clearInterval(interval)
}, [sound]);
const previous = () => {
stop()
setN(n === 0 ? antitled.length - 1: n-1)
};
const next = () => {
stop()
setN(n === antitled.length - 1 ? 0: n+1)
};
const playingButton = () => {
if (isPlaying) {
pause();
setIsPlaying(false);
} else if (!isPlaying) {
play();
setIsPlaying(true);
}
};