Argument of type 'Sound' is not assignable to parameter of type 'SetStateAction'

Question

I'm writing a simple react-native app using typescript and expo-cli. I've imported expo-av but I'm having some trouble when trying to play audio. I'm following [this guide][1] but it's written in javascript and I guess that's the problem here since it's complaining about types.

  import { Audio } from "expo-av";
  
  export const useAudio = () => {
    const [sound, setSound] = useState();

    const playSound = async () => {
        const { sound } = await Audio.Sound.createAsync( // this line causes the error
        require("../assets/sound/ding.mp3")
      );
    setSound(sound);
    await sound.playAsync();
  }
};

[![error message][2]][2]


  [1]: https://docs.expo.dev/versions/v42.0.0/sdk/audio/
  [2]: https://i.stack.imgur.com/PqDgC.png

@AlexShtromberg Nowhere at this point since I got an error in the function. — Mangs, Oct 17 '21 at 09:14

score 2 · Accepted Answer · answered Oct 17 '21 at 09:15

Since you are initializing sound state as undefined (useState()), Typescript doesn't allow setting sound to any other type.

I suggest you type sound like this:

    const [sound, setSound] = useState<Audio.Sound|null>(null);

So, sound is null initially but may be set to another object of type Audio.Sound based on the logic of the component. which requires you to always be careful whether sound is null or not before using any of its properties.

for example:

sound.play() // first check if it isn't null!

Argument of type 'Sound' is not assignable to parameter of type 'SetStateAction'

1 Answers1