javascript - Opriți audio expo-av - React Native Expo

Folosesc Audio din expo-av în react-native-expo.

Pot reda audio folosind metoda loadAsync pe constructorul Audio.sound.

Deși, când încerc să opresc vocea, vocea nu se oprește.

Următorul este fragmentul de cod minimalist. Este aceasta metoda corectă de a opri sunetul? Nu reușesc să găsesc soluția pentru aceasta.

import React, {useState,  useEffect} from 'react';
import {  Button } from 'react-native';
import { Audio } from 'expo-av';

export default function App() {
  const [audioStatus, setAudioStatus] = useState(false)
  const sound = new Audio.Sound();
  
  useEffect(()=>{
    (async () => {
            console.log('status', audioStatus)
            if (audioStatus) {
                await sound.loadAsync('https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3')
                try {
                    await sound.playAsync()
                } catch (e) {
                    console.log(e)
                }
            }else {
                await sound.stopAsync()
                await sound.unloadAsync()
            }
          })()
  },[audioStatus])
  
  return (
      <Button color={audioStatus ? 'red' : 'green'} title={'play'} onPress={()=>setAudioStatus(!audioStatus)} />
  );
}

Mulțumesc anticipat

Răspuns #1

Aceasta este o problemă React. De fiecare dată când componenta ta se reîncarcă, variabila sound este resetată la un obiect Audio.Sound nou, care încă nu este încărcat. Aici, sound ar trebui să facă parte din starea componentei. Poți schimba linia:

const sound = new Audio.Sound();

către

const [sound, setSound] = useState(new Audio.Sound());

și va funcționa.

Expo Gustare