javascript - 如何解决vue 3中的错误 "this is undefine"

Question

我创建了一个如下所示的 vue 组件:

<template>
    <div class="login">
        <h3>Sign in</h3>
        <input type="text" placeholder="Email" v-model="email"/><br>
        <input type="password" placeholder="Password" v-model="password"/><br>
        <button v-on:click="login()">Login</button>
    </div>
</template>

<script>
    import firebase from 'firebase'

    export default {
        name: "Login",
        data: function () {
            return {
                email: '',
                password: ''
            }
        },
        methods: {
            login: function () {
                firebase.auth().signInWithEmailAndPassword(this.email, this.password).then(function (user) {
                    this.$router.replace('home')
                })
            }
        }
    }
</script>

直到我输入用户名和密码并单击“登录”，firebase 身份验证成功并且控制台显示错误“这是未定义”之前，它仍然可以。 我该如何解决这个错误？我无法使用路由器。

Answer 1

尝试使用箭头函数:

firebase.auth().signInWithEmailAndPassword(this.email, this.password).then((user) => {
    this.$router.replace('home')
})