Как я могу получить продолжительность звука mp3-файла в React
Я пытался использовать некоторые пакеты npm, но они, похоже, не работали, на самом деле я использую React-audio-player, хотя проигрыватель работает хорошо и отображает продолжительность, но я хочу получить продолжительность звука раньше воспроизведение и рендеринг в мой плейлист.
<span className = "trackTDuration">8:23</span>
Ответы 2
Вы можете получить доступ к аудиоэлементу через ref (см. Расширенное использование). Элемент Audio предоставляет продолжительность в качестве своего члена.
При использовании компонента из библиотеки вы можете передать onLoadedMetadata props функцию, из которой вы можете получить event.
А с помощью event.target.duration получите нужную продолжительность.
Код будет выглядеть примерно так:
import React from "react";
import ReactAudioPlayer from 'react-audio-player';
export const Container = () => {
const handleLoadMetadata = (meta) => {
const {duration} = meta.target;
console.info(duration);
}
return (
<div className = "container">
<ReactAudioPlayer
src = "path_to_mp3.mp3"
autoPlay
controls
onLoadedMetadata = {handleLoadMetadata}
/>
</div>
);
}
Проблема в том, что у меня есть куча аудиофайлов, которые я хочу прокрутить и получить их продолжительность в процессе.
Но я могу получить только продолжительность текущей песни, которая воспроизводится.