导航 - 无法读取未定义的属性'navigate'

Question

我正在尝试在登录功能之后在"主页"路由上导航，我试图在登录中集成导航功能，但我有错误"无法读取未定义错误的属性'导航'"。

loginUser = (email, password) => {
    try {
        firebase
            .auth()
            .signInWithEmailAndPassword(email, password)
            .then(function(user) {
                this.props.navigation.navigate("Home");
            });
    } catch (error) {
        console.log(error.toString());
    }
};

我也尝试使用() => this.props.navigation.navigate("Home");但没有任何反应。

我的路线工作正常，因为如果我使用 onPress 功能创建一个简单的按钮，则工作正常。

<Button title="Go to Login" onPress={() => this.props.navigation.navigate("Login")} />

你能给我一些提示吗？登录成功后如何导航到主页？

提前谢谢你！

Answer 1

当你在promise-chain中使用function(( {}语法与arrow-function语法时，你正在改变这个(在this.props中(的词法范围。

如果将函数更改为箭头函数，则将保留外部作用域，并有权访问此作用域。

例如

.then((user) => {
   that.props.navigation.navigate("Home");
});

Answer 2

尝试控制台.log(this(。我以为是因为您在 promise 中创建了一个新函数，所以它的范围已经改变。尝试

loginUser = (email, password) => { let that = this; try { firebase .auth() .signInWithEmailAndPassword(email, password) .then(function(user) { that.props.navigation.navigate("Home"); }); } catch (error) { console.log(error.toString()); } };