Я настроил навигацию с помощью 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 }}
/>
)
}