反应原生 - 世博音频停止所有声音

Question

我正在使用Expo Audio播放列表中的一些简短声音。

async playAudio(file) {
try {
await Audio.setIsEnabledAsync(true);
const sound = new Audio.Sound();
await sound.loadAsync(file);
await sound.playAsync(); 
} catch(error) {
console.error(error);
}
}

我从用list.map()渲染的列表中调用

renderTheList = (item, i) => {
return (
<View key={i}> 
<TouchableOpacity onPress={ () => { this.onAudioSelected(item.audio) }}>
</TouchableOpacity>
</View>
)
}
onAudioSelected(audio) {
// Audio.clearSounds() <-- something like this
playAudio(audio)
...
}

声音播放正常，但是当我选择列表中的下一项时，上一个声音不会停止。 因此，如果我连续触摸一堆，就会立即播放一堆声音。

如何停止所有当前播放的声音？

Answer 1

我想到我应该在构造函数中创建播放对象并使用unloadAsync()

constructor(props)
{
super(props);
this.audioPlayer = new Audio.Sound();
}
playSound = async () => {
try {
await this.audioPlayer.unloadAsync()
await this.audioPlayer.loadAsync(require("../soundfile.mp3"));
await this.audioPlayer.playAsync();
} catch (err) {
console.warn("Couldn't Play audio", err)
}
}

完整的文档可在AV - Expo Documents中找到