Forum » Programiranje » React native - ne dobim parametrov v header.
React native - ne dobim parametrov v header.

mihy11 ::
Pozdrav vsem.
Imam 2 screena.
1. Login screen,
2. Main screen (bottomTabNavigator z dvema taboma)
Želje?
Iz login screena želim preko parametrov prenesti uporabnika preko
Naj omenim še to, če v bottomTabNavigator v enega izmed tabov ne dodam stack navigatorja(homeStack) se parametri prenesejo uspešno, vendar ni potem custom headerja.
Moj object zgleda takole: primer brez konkretnih podatkov
Moja koda v app.js
Koda v screenu, kjer ne dobim parametrov;
Imam 2 screena.
1. Login screen,
2. Main screen (bottomTabNavigator z dvema taboma)
Želje?
Iz login screena želim preko parametrov prenesti uporabnika preko
navigation.navigate('Main',{user: user});
Problem nastane, ker v headerju v enem izmed tabov ne dobim teh parametrov. Vsak izmed tabov pa naj bi imel drugačen header, medtem pa Login screen naj ne bi imel headerja torej header: null
v navigationOptions. Kako naj naredim, da bom imel custom header v obeh tabih in da se bodo parametri prenesli uspešno.
Naj omenim še to, če v bottomTabNavigator v enega izmed tabov ne dodam stack navigatorja(homeStack) se parametri prenesejo uspešno, vendar ni potem custom headerja.
Moj object zgleda takole: primer brez konkretnih podatkov
var user: {
name: '...',
lastname: '...',
email: '...',
}
Moja koda v 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 />
);
}
}
Koda v screenu, kjer ne dobim parametrov;
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>
);
}
}
"Computers are good at following instructions, but not at reading your mind."
by Donald Knuth
by Donald Knuth
Vredno ogleda ...
Tema | Ogledi | Zadnje sporočilo | |
---|---|---|---|
Tema | Ogledi | Zadnje sporočilo | |
! | Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 4 … 23 24 25 26 )Oddelek: Izdelava spletišč | 355621 (14758) | sunniegoldie |
» | PM2 (Node.js Process Manager) in uporabnikiOddelek: Operacijski sistemi | 812 (748) | dunda |
» | Bootstrap pomoč- PreheaderOddelek: Izdelava spletišč | 834 (665) | zbrisan |
» | JqueryOddelek: Izdelava spletišč | 1878 (1602) | mk818764 |
» | AJAX neznana težavaOddelek: Programiranje | 1251 (1045) | luksorzi |