Передача функции из класса в URL плеера React-Native

Question

Итак, я получил на одной из моих страниц моего собственного React функциональность проигрывателя треков (TrackPlayer) и пользовательский интерфейс (класс Player). Каким-то образом мне удалось заставить их работать вместе, но теперь я хочу, чтобы плеер воспроизводил песни динамически.

В классе player у меня есть функция meditationList(), которая возвращает адрес, который я хотел бы использовать для URL-плеера. Однако я не могу получить к нему доступ, потому что находятся в разных компонентах. В принципе, я бы хотел, чтобы URL-адрес Trackplayer воспроизводил "JSON.stringify(adress.meditation.meditationPlayerAdress);"(это возвращает тот же адрес, что и URL-адрес). Любая помощь, в которой я ошибаюсь, будет настоящей помощью. На момент

TrackPlayer.setupPlayer().then(async () => {
  // Adds a track to the queue

  await TrackPlayer.add({
    id: 'trackId',
    url: require('../../../assets/track.mp3'),
    title: 'Track Title',
    artist: 'Track Artist',
  });

  let trackId = await TrackPlayer.getCurrentTrack();

  // Starts playing it
  TrackPlayer.stop();
});

export default class Player extends React.Component<Props> {
  pause = () => {
    TrackPlayer.pause();
    console.log(TrackPlayer);
  };

  stop = () => {
    TrackPlayer.stop();
    console.log(TrackPlayer);
  };
  play = () => {
    TrackPlayer.play();
    console.log(TrackPlayer.getState());
  };
  meditationList = () => {
    const adress = this.props.route.params;

    return JSON.stringify(adress.meditation.meditationPlayerAdress);
  };

  state = {
    trackLength: 300,
    timeElapsed: '0:00',
    timeRemaining: '5:00',
  };

  changeTime = (seconds) => {
    this.setState({timeElapsed: Moment.utc(seconds * 1000).format('m:ss')});
    this.setState({
      timeRemaining: Moment.utc(
        (this.state.trackLength - seconds) * 1000,
      ).format('m:ss'),
    });
  };

  render() {
    return (
      <SafeAreaView style={styles.container}>
        <View style={{alignItems: 'center'}}>
          <View style={{alignItems: 'center', marginTop: 24}}>
            <Text style={[styles.textLight, {fontSize: 12}]} />

            <Text
              style={[
                styles.text,
                {fontSize: 15, fontWeight: '500', marginTop: 8},
              ]}>
              {this.meditationList()}meditations
            </Text>
          </View>

          <View style={styles.coverContainer}>
            <Image
              source={require('../../../assets/coverArt.jpg')}
              style={styles.cover}
            />
          </View>

          <View style={{alignItems: 'center', marginTop: 32}}>
            <Text style={[styles.textDark, {fontSize: 20, fontWeight: '500'}]}>
              Exhale
            </Text>
            <Text style={[styles.text, {fontSize: 16, marginTop: 8}]}>sal</Text>
          </View>
        </View>