Question

我使用的是React-Navigation，导航栏出现问题。我有一个名为LoginScreen的页面，它在登录后将用户移动到HomeScreen。我遇到的问题是我有一个＆＃39;回来＆＃39;主屏幕上的按钮，所以我可以回到登录屏幕（我不想要）这是代码：

LoginScreen（我导航到主屏幕）：

handlePress(navigate){
    firebaseRef.auth().signInWithEmailAndPassword(this.state.email, this.state.password).then(function(firebaseUser){
      //Success, move to homepage.
      navigate("Home");
    }).catch(function(error){
      //Failed to log in, print error.
    });
}

导航在render()内：

const { navigate } = this.props.navigation;

这是我调用handlePress的地方：

<TouchableOpacity style={styles.logBtn} onPress={()=>this.handlePress(navigate)}>
  <Text style={styles.logTxt}>
  Login
  </Text>
</TouchableOpacity>

我搜索了一下，尝试在navigate.replace("Home");中写handlePress，但它当时不会导航。

我做错了什么？

Answer 1

我认为你要做的最好的事情就是重置你可以通过重置进行的导航：

import { NavigationActions } from 'react-navigation';


    const resetAction = NavigationActions.reset({
      index: 0,
      actions: [
        NavigationActions.navigate({ routeName: 'Home'})
      ]
    })
    this.props.navigation.dispatch.(resetAction);

您可以在react-navigation-doc

找到或阅读更多相关信息

或者您可以在HomeScreen导航配置中更改后退按钮图标及其功能

static navigationOptions  = {
        title: 'Home',
        header: ({ navigate }) => {
        {/* left here refers to the left back button */}
            let left = (
                <TouchableOpacity onPress={() => navigate('Profile')} >
                    <Icon name="ios-menu-outline"
                    size={25} style={{ paddingRight: 5, paddingLeft: 20 }}
                    color="#ffffff" />
                </TouchableOpacity>
            );
            let style = { backgroundColor: '#00AFEF',elevation: 0,shadowOpacity: 0,};
            let titleStyle = { color: '#ffff', fontSize: 25, fontFamily: 'Arial' };
            return { left, style, titleStyle }
        },
    }

Answer 2

npm install --save request
npm install --save request-promise

适合我;）

删除＆＃39;返回＆＃39;按键

2 个答案: