Se llama a la función de pausa dentro del componente de reacción, pero no sucede nada
Dec 28 2020
Tengo un botón de alternancia para reproducir y pausar. aquí está el código:
export default (props) => {
let [soundState, setSoundState] = useState({ state: 'off' })
let [soundId, setSoundId] = useState(null)
let [soundSeek, setSoundSeek] = useState(null)
var sound = new Howl({
src: [props.url],
html5: true,
volume: 1,
myMusicID: '',
saveSeek: null,
onpause: () => {
console.log('pause', soundId)
}
})
const onPlayHandle = () => {
setSoundState({ state: 'playing' })
let id = sound.play()
setSoundId(id)
sound.seek(soundSeek, soundId)
}
const onPauseHandle = () => {
console.log('onPauseHandle', soundId)
sound.pause(soundId)
setSoundSeek(sound.seek(soundId))
}
}
onpause
es fuego pero el sonido sigue funcionando ...
por favor un poco de ayuda ...
Respuestas
2 lissettdm Dec 29 2020 at 00:07
Cada vez que su componente es renderizado, Howl
se crea una nueva instancia. Necesita usar useRef para mantener la referencia de la instancia:
const soundRef = useRef(new Howl({
src: ["http://listen.vo.llnwd.net/g3/prvw/6/5/8/3/1/2255913856.mp3"],
html5: true,
volume: 1,
myMusicID: "",
saveSeek: null,
onpause: () => {
console.log("pause", soundId);
}
}));
const sound = soundRef.current;