отреагировать навигационная кнопка назад вернуться к экрану spalsh - PullRequest
0 голосов
/ 26 октября 2018

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

const TabNav=createBottomTabNavigator({
        Notification:{
            screen:Notif,
            navigationOptions: () => ({
                title:'',
                tabBarIcon: ({ tintColor }) => {
                    return (
                        <IconIonicons
                            name='ios-notifications'
                            size={40}
                            color={tintColor}
                        />
                    );
                },
                tabBarOptions: {
                    activeTintColor: '#000',
                }
            })
        },

        Home:{
            screen:Home3,
            navigationOptions: () => ({
                title:'',

                tabBarIcon: ({ tintColor }) => {
                    return (
                        <Image style={{ width: 40, height: 40,marginTop:'20%' }} source={Home}/>
                    );
                }

            })
        },
        User:{
            screen:ProfileScreen,
            navigationOptions: () => ({
                title:'',
                tabBarIcon: ({ tintColor }) => {
                    return (
                        <IconIonicons
                            name='ios-person'
                            size={40}
                            color={tintColor}
                        />
                    );
                },
                tabBarOptions: {
                    activeTintColor: '#000',
                }
            })

        },



    },
    {
        initialRouteName:"Home"
    },{
        header: null,
        headerMode: 'none',
    }
)

const StackHome = createStackNavigator({
    Tabs:{
        screen:TabNav
    },
    CardView:{
        screen:CardView,
    },
    Thumb:{
        screen:Thumb,
    },  Item:{
        screen:Item,
    },  Product:{
        screen:ProductScreen,
    },  Festivals:{
        screen:Festivals,
    } ,  Review:{
        screen:Review,
    } ,  Movie:{
        screen:Movie,
    } ,  Naghd:{
        screen:Naghd,

    } ,  Advertisment:{
        screen:Advertisment,
    } ,  Advertis:{
        screen:Advertis,
    },  CreateAd:{
        screen:CreateAd,
    },  Insta:{
        screen:Insta,
    },  Test:{
        screen:Test,
    },  ForoshRah:{
        screen:ForoshRah,
    },  Home2:{
        screen:Home2,
    },  Login:{
        screen:Login,
    },  Elan:{
        screen:Elan,
    },  Sabtenam:{
        screen:Sabtenam,
    },  sponser:{
        screen:sponsor,
    },Splash:{
        screen:Spalsh
    },Products:{
        screen:Products
    },
        initialRouteName : 'Home',
},{

    headerMode:'none',
        navigationOptions: {

            header: (props) => <ImageHeader {...props} />,

        }
    }

)

const RootNav = createStackNavigator({
    StackHome:{
      screen:StackHome
    },
    Splash:{
        screen:Spalsh
    },Login:{
        screen:Login
    },
},{
        initialRouteName : 'Splash',
        header: null,
});

1 Ответ

0 голосов
/ 27 октября 2018

Вы можете использовать SwitchNavigator от React Navigation.Ведь SwitchNavigator должен показывать только один экран за раз.По умолчанию он не обрабатывает обратные действия и сбрасывает маршруты в их состояние по умолчанию при переключении.

Пожалуйста, укажите это https://reactnavigation.org/docs/en/switch-navigator.html

Remove the **Splash** Screen from your **StackHome** StackNavigator
Alter your **RootNav** with Switch Navigator like below

// Uses SwitchNavigator
const RootNav = createSwitchNavigator({
    StackHome:{
      screen: StackHome
    },
    Splash:{
        screen: Splash
    },Login:{
        screen: Login
    },
},{
        initialRouteName : 'Splash'
});

Ваш StackHome состоит из нескольких стековых навигаторовэкраны, вы можете установить параметры навигации оттуда, чтобы установить изображение в заголовке.Вы можете установить, как показано ниже.

const StackHome = createStackNavigator({
    CardView:{
        screen: CardView,
        navigationOptions: ({ navigation }) => ({
            headerTitleStyle: { flex: 1, fontWeight: 'normal', fontSize: 15, color: '#FFFFFF', fontFamily: 'DroidSans-Bold' },
            headerTintColor: "#2662b2",
            headerStyle: {
                backgroundColor: "#05BFFF",
            },
            headerRight:(<View><NotificationComponent navigation={navigation}/></View>)            
        })
    },
    Thumb:{
        screen: Thumb,
    },  Item:{
        screen: Item,
    }
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...