Реагировать навигатор пройти NavigationOptions prop - PullRequest
0 голосов
/ 06 декабря 2018

Я настроил навигацию с помощью React Navigator 3.0. Чтобы успешно передавать реквизиты из родительского компонента, я вызываю мой TabNavigator следующим образом:

return (
        <View style={styles.container}>
          <TabNavigator screenProps={{deleteToken: this.deleteJWT }} />
        </View>
      );

Мой компонент TabNavigator затем отображает несколько экранов.Мой предыдущий метод состоял в том, чтобы использовать код по умолчанию в документации (показано ниже для HomeScreen), но теперь, так как я передаю реквизиты, мне нужно использовать метод, показанный ниже для ProfileScreen (функция стрелки).

Myпроблема в том, что я не знаю, куда поместить навигационные опции для ProfileScreen при использовании функции со стрелкой.

const TabNavigator = createBottomTabNavigator(
  {
  Profile: (props) => {
    return <ProfileScreen {...props.screenProps} />;
  },
  Home: { screen: HomeScreen,
          navigationOptions: {
            //tabBarLabel: 'Inicio',
            tabBarIcon: ({ tintColor, focused }) => (
          <Ionicons
            name={focused ? 'ios-home' : 'ios-home'}
            size={26}
            style={{ color: tintColor }}
          />
        ),
          //  tabBarIcon: () => {
          //                <Image
          //                style={{ width: 50, height: 50 }}
          //                source={{ uri: 'https://facebook.github.io/react/img/logo_og.png' }}
          //                />
        //},
        }
      },

Обновление: очевидным местом было бы поместить объект NavigationOptions в возвращаемый экран, ноигнорируется:

export default class ProfileScreen extends React.Component {
  static navigationOptions = {

        tabBarLabel: 'Perfil',
        tabBarIcon: ({ tintColor, focused }) => (
      <Ionicons
        name={focused ? 'ios-person' : 'ios-person'} //TODO change to focused icon
        size={26}
        style={{ color: tintColor }}
      />
    )
  }

1 Ответ

0 голосов
/ 06 декабря 2018

Это правильный синтаксис:

const TabNavigator = createBottomTabNavigator(
  {
  Profile: {
    screen: props => <ProfileScreen {...props.screenProps} />,
    navigationOptions: {
        //tabBarLabel: 'Perfil',
        tabBarIcon: ({ tintColor, focused }) => (
      <Ionicons
        name={focused ? 'ios-person' : 'ios-person'} //TODO change to focused icon
        size={26}
        style={{ color: tintColor }}
      />
    ),
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...