Установите initialRouteName динамически в React Navigation TabNavigator - PullRequest
Новая
       56

Установите initialRouteName динамически в React Navigation TabNavigator

0 голосов
/ 02 июня 2018

Я хочу установить initialRouteName моего TabNavigator динамически в заставке.В заставке я решаю initialRouteName на основе результата API, но я не знаю, как передать это имя маршрута в мой файл маршрутизатора.

Router.tsx: 

public static Routes = StackNavigator({
    Splash: { screen: Splash },
    Verification: { screen: Verification },
    Login: { screen: Login },
    Main: {
        screen: TabNavigator({
            Calendar: { screen: Calendar },
            PendingReserves: { screen: PendingReserves },
            Profile: { screen: Profile },
        }, 
        {initialRouteName: 'Calendar'}) // I want to set it from splash
    }        
}, {initialRouteName: 'Splash'} );

splash.tsx: 

constructor(props: SplashScreenProps, context: any) {
    super(props, context);
    this.state = {
        Error: false
    }
    this.check()
}

check = async () => {
    let pending = await dataService.getPendingReserves(data);
    if (pending.Success) {                
        if (pending.result.length > 0) {
            // go to pendingReserve Tab
        } else {
            // go to Calendar Tab
        }
    } else {
        this.setState({ Error: true })
    }
}

Я попытался статически перенаправить на PendingReserve и в его конструкторе, проверить API и вкладку измененияпри необходимости, но я не мог программно изменить вкладку с помощью этого кода:

pendingReserve.tsx: 

fetchData = async () => {
    let res = await Utilities.getPendingReserves()
    if (res && res.length > 0) {
        ...
    } else {
        const resetAction = NavigationActions.reset({
            index: 0,
            actions: [NavigationActions.navigate({ routeName: 'Calendar' })]
        })
        this.props.navigation.dispatch(resetAction)
        // this.props.navigation.navigate({ routeName: 'Calendar' })
        // both reset and simple navigate are not works correctly... 
    }
}

Так что любое решение для динамически установленной initialRouteName ИЛИ изменения вкладки программно поможет мне.Спасибо

Я использую: 

"react-native": "0.49.3",
"react-navigation": "^1.0.0-beta.13"

1 Ответ

0 голосов
/ 03 июня 2018

Наконец ... Я не нашел способа программно изменить вкладку в react navigation версии 1, поэтому я обновляюсь до версии 2, и this.props.navigation.navigate('Calendar') работает правильно.

...