我在主(homeStack)屏幕上的头文件没有参数。
当我用Home:{screen:Home}而不是Home:{screen:homeStack}更改createBottomTabNavigator时,参数成功地转移到了该屏幕的标题中。我不知道为什么会这样。请帮我。
我的app.js代码:
const homeStack = createStackNavigator({
screen1: {
screen: Home,
navigationOptions: {
headerStyle: {
backgroundColor: '#f4511e',
},
headerTintColor: '#fff',
headerTitleStyle: {
fontWeight: 'bold',
},
},
},
},{ initialRouteName: 'screen1'});
const Routes = createStackNavigator({
Login: {
screen: Login,
navigationOptions: {
header: null,
}
},
Main: {
screen: createBottomTabNavigator({
Home: { screen: homeStack },
Profile: { screen: Settings },
}, {
initialRouteName:'Home',
})
}
},{
initialRouteName: 'Login',
});
export default class App extends React.Component {
render() {
return (
<Routes />
);
}
}
屏幕首页中的代码为标题:
export default class Home extends React.Component {
static navigationOptions = ({ navigation, navigationOptions }) => {
console.log(navigationOptions);
console.log(navigation);
// Notice the logs ^
// sometimes we call with the default navigationOptions and other times
// we call this with the previous navigationOptions that were returned from
// this very function
/*return {
title: navigation.getParam('user', 'A Nested Details Screen'),
headerStyle: {
backgroundColor: navigationOptions.headerTintColor,
},
headerTintColor: navigationOptions.headerStyle.backgroundColor,
headerTitle: navigation.state.params.user.name,
}; */
return {
headerTitle: navigation.state.params.user.name,
}
};
render() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
<Text>Changes you make will automatically reload.</Text>
<Text>Shake your phone to open the developer menu.</Text>
</View>
);
}
}