Как создать главные вкладки в React Navigation v3?

Question

Я могу видеть документацию, что v3 createTabNavigator был удален.Он был заменен на createBottomTabNavigator, createMaterialTopTabNavigator и createMaterialBottomTabNavigator.

. Я использую createBottomTabNavigator для навигации по главному экрану, но хотел бы иметь вкладки в верхней части каждого экрана длякатегории контента.

Мы не используем дизайн материала в этом проекте, поэтому опция createMaterialTopTabNavigator не помогает.

Answer 1

Используйте createMaterialTopTabNavigator и настройте параметры стиля с помощью tabBarOptions в соответствии с дизайном вашего проекта.

Если вам нужно больше настроек, чем указано, то вы можете переопределить tabBarComponent своим собственным. Вот исходный код для tabBarComponent, который createMaterialTopTabNavigator использует по умолчанию в качестве ссылки для создания собственного пользовательского tabBarComponent.

Для ясности, почему createTabNavigator был удален в 3.0, вот примечания к выпуску React Navigation 2.0 . createTabNavigator раньше использовал createBottomTabNavigator на iOS и createMaterialTopTabNavigator на Android, что было непрактично, если вы хотели, чтобы ваше приложение выглядело одинаково на обоих устройствах, поэтому оно было разделено на эти две функции.