react-native - 次のトラックにスキップできません - React-Native-Track-Player

Question

現在、開発中のアプリの 1 つのポッドキャスト プレーヤー機能を作成しています。ただし、配列の currentIndex を次のものに更新するというこのエラーで壁にぶつかりました。これは、ポッドキャスト プレーターをテストするために作成した配列です。

const [ episodes, setEpisodes ] = useState([
    {   
        id: 1,
        date: 'Today',
        title: 'Episode 10: Postcast 1',
        description: 'This is the podcast description',
        duration: '25 mins',
        image: require('../../../assets/images/podcast_image.jpg'),
        audio_url: 'https://www.soundhelix.com/examples/mp3/SoundHelix-Song-2.mp3',
    },
    {
        id: 2,
        date: '10/11/2020',
        title: 'Episode 11: Postcast 2',
        description: 'This is the podcast description',
        duration: '25 mins',
        image: require('../../../assets/images/podcast_image.jpg'),
        audio_url: 'https://audio-previews.elements.envatousercontent.com/files/103682271/preview.mp3',
    },
    {
        id: 3,
        date: '10/11/2020',
        title: 'Episode 12: Postcast 3',
        description: 'This is the podcast description',
        duration: '25 mins',
        image: require('../../../assets/images/podcast_image.jpg'),
        audio_url: 'https://www.soundhelix.com/examples/mp3/SoundHelix-Song-16.mp3',
    }
]);

次に currentIndex を次の画面に渡して、エピソードとポッドキャスト オブジェクトと共に正しいポッドキャストをレンダリングします。

  <TouchableOpacity onPress={() => navigation.navigate("PodcastPlayer", {
      currentIndex: index,
      podcast: podcast,
      episodes: episodes,
  })}>     

  var { currentIndex } = route.params;

これが私がTrackPlayerに使用した方法です

const trackPlayerInit = async () => {
    await TrackPlayer.setupPlayer();
    TrackPlayer.updateOptions({
        stopWithApp: true,
        notificationCapabilities: [
            TrackPlayer.CAPABILITY_PLAY,
            TrackPlayer.CAPABILITY_PAUSE,
            TrackPlayer.CAPABILITY_SKIP_TO_NEXT,
            TrackPlayer.CAPABILITY_SKIP_TO_PREVIOUS,
            TrackPlayer.CAPABILITY_STOP
        ],
        capabilities: [
            TrackPlayer.CAPABILITY_PLAY,
            TrackPlayer.CAPABILITY_PAUSE,
            TrackPlayer.CAPABILITY_SKIP_TO_NEXT,
            TrackPlayer.CAPABILITY_SKIP_TO_PREVIOUS,
            TrackPlayer.CAPABILITY_STOP
        ],
        compactCapabilities: [
            TrackPlayer.CAPABILITY_PLAY,
            TrackPlayer.CAPABILITY_PAUSE
        ]
    });
    // After the track player has been set up, we can add to our playlist
    await TrackPlayer.add({
        id: episodes[currentIndex].id,
        url: episodes[currentIndex].audio_url,
        type: 'default',
        title: episodes[currentIndex].title,
        album: 'My Album',
        artist: 'Track Artist',
        artwork: 'https://picsum.photos/100'
    });
    return true;
};

トラックをスキップすると、次のトラックがコンソールに記録されますが、実際の画面では更新されないため、わかりません。currentIndex新しい状態の内部に入れて更新しようとしたので、次のボタンがクリックされると、画面が再レンダリングされます。しかし、私は運がありませんでした。

これは、次のトラック アイコンをクリックしたときに呼び出される関数です。

  <TouchableOpacity style={styles.control} onPress={() => handleNextTrack()}>
       <Ionicons name='ios-skip-forward' size={30} color={Colours.type.dark_blue} />
  </TouchableOpacity>

  handleNextTrack = async() => {

    currentIndex + 1;

    console.log(currentIndex);

    // setNextEpisode(currentIndex);
    
    // get the id of the current track
    let trackId = await TrackPlayer.getCurrentTrack();      
    
    TrackPlayer.skip(trackId);    

    console.log(trackId);
}

どんな助けでも大歓迎です！