Получение данных из одного класса, чтобы сделать его заголовком вкладки stackNavigator?

Question

import { createStackNavigator } from "react-navigation";
import React, { Component } from "react";

class Navigator extends React.Component {
  render() {
    const TitleNameParam = navigation.getParam('TitleNameParam');
    var TitleNameString = JSON.stringify(TitleNameParam);
    var TitleNameObject = JSON.parse(TitleNameString);
  }


}


const AppNavigator = createStackNavigator({
  Launching: {
    screen: LaunchingScreen,
    navigationOptions: {
      title: "Launching Soon",
      headerTitleAllowFontScaling: true,
      headerBackTitle: "Back"
    }
  },

  InfoScreen: {
    screen: InfoScreen,
    navigationOptions: {
      title: Navigator.TitleNameParam,
    }
  }
});



export default AppNavigator;

Итак, я хочу получить данные (это из API) из одного класса в класс стекового навигатора, чтобы я мог заменить заголовок на тот, что это за данные. Сейчас у меня есть класс Navigator, получающий данные (из TitleNameParam), который превращает данные в строку, в которой навигатор пытается получить их на вкладке InfoScreen, но ничего не отображается.

Answer 1

Используйте navigationOptions в компоненте InfoScreen:

class InfoScreen extends React.Component {
  // Set the navigation options for `react-navigation`
  static navigationOptions = ({navigation}) => {
    return {
      headerTitle: navigation.getParam('TitleNameParam');
    }
  }
…
}

При переходе по этому маршруту используйте:

this.props.navigation.navigate('InfoScreen', {TitleNameParam: yourComputedTitleName})

Пожалуйста, дайте мне знать, если это правильно.