react-native嵌套StackNavigator传递参数

时间:2018-05-12 18:36:19

标签: react-native

我最初使用tabNagivator设置了此路由,然后我正在导航到' Home'路由和传递参数使用:

this.props.navigation.navigate('Home',{station:e,code:f,filter:'',filterName:'',offset:0});

路由:

const PrimaryNav = TabNavigator({
Home: {
    screen: LaunchScreen,
    navigationOptions: {
        swipeEnabled: false,
        tabBarIcon: ({
            tintColor
        }) => ( <
            Image source = {
                require('../Images/trains.png')
            }
            style = {
                [styles.icon]
            }
            />
        ),
    },
},
Map: {
    screen: MapScreen,
    navigationOptions: {
        tabBarIcon: ({
            tintColor
        }) => ( <
            Image source = {
                require('../Images/locationTab.png')
            }
            style = {
                [styles.icon]
            }
            />
        ),

    },
},
}, {
headerMode: 'none',
tabBarPosition: 'top',
animationEnabled: true,
tabBarOptions: {
    showIcon: true,
    showLabel: false,
    activeTintColor: '#ffffff',
    indicatorStyle: {
        borderBottomColor: '#33b2f4',
        borderBottomWidth: 3,
    },
    style: {
        backgroundColor: '#000', // Makes Android tab bar white instead of standard blue
        paddingTop: 5,

    }
},

});

我现在要做的是替换“LaunchScreen”&#39;在带有stackNavigator的Home路由中,但我不知道现在如何将参数传递给stackNavigator,直到&#39; LaunchScreen&#39;:

const FeedStack = StackNavigator({
    Launch: {
        screen: LaunchScreen,
        navigationOptions: {
            header: null,
        },

    },
    Tweets: {
        screen: TweetScreen,
        navigationOptions: {
            title: 'Service Tweets',
            headerTintColor: '#fff',
            headerStyle: {
                backgroundColor: '#000'
            },

        },
    },

}, {
    initialRouteName: 'Launch',
}

);

const PrimaryNav = TabNavigator({
Home: {
screen: FeedStack,
navigationOptions: {
    swipeEnabled: false,
    tabBarIcon: ({
        tintColor
    }) => ( <
        Image source = {
            require('../Images/trains.png')
        }
        style = {
            [styles.icon]
        }
        />
    ),
},
}...

1 个答案:

答案 0 :(得分:0)

我通过导航到路线并将参数存储在我的mobX商店中完全绕过导航参数来解决这个问题。