Я создаю пользовательскую навигацию по боковой панели в реагирующем. Я использовал пример CustomTabs из репозитория реакции-навигации, который работает отлично. Как описано в документации (https://reactnavigation.org/docs/en/stack-navigator.html#params), я должен иметь возможность устанавливать параметры по умолчанию для обозначения кнопок на каждом маршруте, но консоль всегда говорит «неопределено». Где я ошибаюсь?
Я могу установить параметры с помощью navigating.navigate (), но он не работает, когда я на самом деле создаю маршруты
import * as React from "react";
import {
createNavigator,
createNavigationContainer,
TabRouter
} from 'react-navigation';
import { View, Button, Text} from "react-native";
const MyNavScreen = ({ banner }) => (
<View style={{padding: 15}}>
<Text>Banner: {banner}</Text>
</View>
);
const CustomTabBar = ({ navigation }) => {
const { routes } = navigation.state;
return (
<View style={{borderRightWidth: 1, borderRightColor: "darkgrey"}}>
{routes.map(route => (
// No default params in my route???
<Button
onPress={() => navigation.navigate(route.routeName)}
title={`${route.params.label} (${route.params.badgeCount})`}
key={route.routeName}
>
</Button>
))}
</View>
);
};
class CustomTabView extends React.Component<any> {
render() {
const { navigation, descriptors } = this.props;
const { routes, index } = navigation.state;
const descriptor = descriptors[routes[index].key];
const ActiveScreen = descriptor.getComponent();
return (
<View style={{flex: 1, flexDirection: "row"}}>
<CustomTabBar navigation={navigation} />
<ActiveScreen navigation={descriptor.navigation} />
</View>
);
}
}
// Creating my router with needed params like label, badgecounts and so on...
const CustomTabRouter = TabRouter(
{
Home: {
screen: ({navigation}) => <MyNavScreen banner="Home Screen" navigation={navigation} />,
param: {
label: "XBox",
type: "bold",
badgeCount: 12
}
},
Notifications: {
screen: ({navigation}) => <MyNavScreen banner="Notification Screen" navigation={navigation} />,
param: {
label: "Playstation",
type: "default",
badgeCount: 2
}
},
Settings: {
screen: ({navigation}) => <MyNavScreen banner="Settings Screen" navigation={navigation} />,
param: {
label: "Nintendo",
type: "default",
badgeCount: 0
}
},
},
{}
);
const MyApp = createNavigationContainer(
createNavigator(CustomTabView, CustomTabRouter, {})
);
Как получить доступ к параметрам в моем компоненте CustomTabBar?