'Expo Audio won't stop looping

I'm using Expo-AV to play a sound when I load the screen using componentDidMount, since the audio isn't very long I want to loop it until the user presses a button to stop it, the audio starts correctly but when it starts to loop the audio doesn't stop anymore.

(I have another function in fetchNewOrder which I need to keep running, that's why I don't want to stop the interval)

This is the documentation I'm following: https://docs.expo.dev/versions/v44.0.0/sdk/av/

export class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      sound: null,
    };
  }

  async componentDidMount() {
    this.updateTimer = setInterval(() => {
      this.fetchNewOrders();
      }, 10000);
  }


  fetchNewOrders = async () => {
     const { sound } = await Audio.Sound.createAsync(require('../../../assets/ringtone2.mp3'));
       this.setState({sound: sound});
       this.playSound()
  }

  playSound = async () => {
      await this.state.sound.playAsync()
      await this.state.sound.setIsLoopingAsync(true)
  };

  stopSound = async () => {
    await this.state.sound.stopAsync()
    await this.state.sound.unloadAsync()
  }


render() {
  return(
    <View>  
      <Button
        onPress={this.stopSound}
      />
    </View>
   )
 }
}


Solution 1:[1]

To stop the setInterval loop, you have to call clearInterval(idOfSetInterval). setInterval returns an id.

this.updateTimer = setInterval(() => {
      this.fetchNewOrders();
      }, 10000);

console.log(this.updateTimer)

updateTimer is an id an in stopSound call clearInterval.

stopSound = async () => {
    clearInterval(this.updateTimer)
  }

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Yilmaz