verstecken Ich baue eine CRM-App für meine Firma. Auf der Anmeldeseite ist es eine leere Kopfzeile. Nach dem Einloggen wird dem Benutzer eine Liste der Kundenaufträge angezeigt. Ich habe einen Abmeldeschalter auf der rechten Seite der Kopfzeile des Kundenauftragslistenbildschirms. Wenn ich abmelde, leite ich auf die Anmeldeseite um, aber auf der linken Seite der Kopfzeile erscheint eine Zurück-Schaltfläche mit ("Kundenbestellungen"). Ich habe versucht, den Header auf Null in meiner AppNavigator-Klasse, durch die statischen navigationOptions setzen und haben versucht, viele verschiedene Methoden, um den Header auf null setzen, aber der Header immer angezeigt wird. Es scheint, als ob die Anmeldeseite aus irgendeinem Grund keine navigationOptions erkennt. Hier ist etwas von meinem Code für Ihre Referenz .. Es ist lustig, weil die Einstellung navigationOptions auf SalesOrderList und SalesOrderItem funktioniert perfekt, aber die Kopfzeile auf Login.js will immer aus irgendeinem Grund sichtbar sein .... kann es nicht herausfinden! !! Hilfe! Ich habe versucht {header: null}, {headerLeft: null}, {headerVisible: false}, {header {left: null}}, {header {visible: false}} und Gott weiß was noch ...Header kann nicht auf dem Anmeldebildschirm in reaktiven nativen
AppNavigator.js
const routeConfiguration = {
App: { screen: App },
Login: { screen: Login },
SalesOrderList : { screen: SalesOrderList },
SalesOrderItem : { screen: SalesOrderItem },
};
const stackNavigatorConfiguration = {
initialRouteName: 'App',
headerMode: 'screen'
}
export default AppNavigator = StackNavigator(routeConfiguration,stackNavigatorConfiguration)
AppRegistry.registerComponent('crm',() => AppNavigator);
Login.js
export default class Login extends Component {
constructor(props){
super(props);
}
state = {
email: '',
password: '',
error: '',
loading: false,
loggedIn: null
};
onButtonPress() {
const { email, password } = this.state;
this.setState({
email: email.toString(),
password: password.toString(),
error: '',
loading: true,
loggedIn: false
});
console.log('Logins navigationOptions');
console.log(Login.navigationOptions);
this.onAuthSuccess();
const auth0 = new Auth0({ domain: 'crm.auth0.com', clientId: 'XXXXXXXXXXXXXXXXXXXXXXXXXXX' });
// auth0
// .auth
// .passwordRealm({username: {email}, password: {password}, realm: "urn:auth0:crm"})
// .then(authResult =>
// console.log(authResult)
// )
// .catch(error =>
// console.error(error)
// )
}
onAuthSuccess() {
const { navigate } = this.props.navigation;
this.setState({
loading: false,
loggedIn: true
});
this.props.updateAppState({loggedIn: true});
console.log(this.props.navigation);
navigate('SalesOrderList', {updateAppState: this.props.updateAppState});
}
onAuthFailed() {
this.setState({
error: 'Authentication Failed',
loading: false,
loggedIn: false
});
this.props.updateAppState({loggedIn: false});
this.props.navigation.navigate('App');
}
static navigationOptions = { headerLeft: null, };
render() {
const { navigate } = this.props.navigation;
const { form, fieldStyles, loginButtonArea, errorMessage, welcome, container } = styles;
return (
<View style={styles.container}>
<Text style = {styles.labelText} >Login to ISSI CRM</Text>
<MKTextField
text={this.state.email}
onTextChange={email => this.setState({ email })}
textInputStyle={fieldStyles}
placeholder={'Email...'}
tintColor={MKColor.Teal}
/>
<MKTextField
text={this.state.password}
onTextChange={password => this.setState({ password })}
textInputStyle={fieldStyles}
placeholder={'Password...'}
tintColor={MKColor.Teal}
password={true}
/>
<Text style={errorMessage}>
{this.state.error}
</Text>
<View style={loginButtonArea}>
<LoginButton onPress={this.onButtonPress.bind(this)} />
</View>
</View>
);
}
}