react-native - 渲染被多次调用并产生问题，因为我正在使用 expo-av 声音

Question

当我第一次调用此组件时，它会多次播放声音，但在第二次或第三次调用这些组件后它会正确播放。我正在使用它同时显示图像和声音，图像和文本显示正确，但声音失败。

这是我的渲染函数，我正在使用 PureComponent 但它不起作用

  render() {

    
    PlaySound({
      url:this.props.sonido
    });

    if (this.state.fontsLoaded) {
      return (
          <AppLoading />
      );
    }

    const respuesta = this.props.respuesta;
    return !this.state.loading ? (
      <View style={styles.container}>
        <View style={{ flex: 3, backgroundColor: "#fff" }}>
          <Image
            source={{uri:this.props.imagen}}
            style={{
              flex: 1,
              alignContent: "center",
              alignSelf: "center",
              width:600,
              height:600
            }}
            resizeMode={"contain"}
          />
        </View>
        <View style={{ flex: 1, backgroundColor: "#fff" }}>
          {respuesta.includes("I") != true ? (
            <Text
              style={{
                fontFamily: "Century",
                textAlign: "center",
                fontSize: 48,
              }}
            >
              {respuesta}
            </Text>
          ) : (
            <TextWithI palabra={respuesta} />
          )}
        </View>
      </View>
    ) : (
      <LottieView
        source={require("../../../../assets/890-loading-animation.json")}
        autoPlay
        loop
      />
    );
  }

和 PlaySound.js

import { Audio } from "expo-av";

export default async function PlaySound(item) {
    
    try {
      const soundObject = new Audio.Sound();
      soundObject.setOnPlaybackStatusUpdate((status) => {
        if (!status.didJustFinish) return;
        soundObject.unloadAsync();
    });
        await soundObject.loadAsync({ uri: item.url }, {}, true);
        await soundObject.playAsync();

    } catch (error) {
      console.log("Error-Audio",error)
    } finally {

    }
  }

任何帮助将不胜感激