0

I am trying to write login code, but this firebase get function is refraining me to do so. I am unable to call any function (except alert), within this get function. Navigating to another component also does not work here. I know I have to use async/await keywords but I dont know how to. Can someone please help me with this? Pasting the code below.

navigate() {
    alert("Aya");
}
 login() {
    const { uname } = this.state;
    const { password } = this.state;
    var userid = "";
    var data;
    if (uname && password) {
        firebase
            .auth()
            .signInWithEmailAndPassword(uname, password)
            .then(async user => {
                userid = await firebase.auth().currentUser.uid;
               await db.collection("Users").doc(userid)
                    .get()
                    .then(function (doc) {
                        if (doc.exists) {
                            data = doc.data();
                            alert(JSON.stringify(data.role));
                            if (data.role === "Company Admin") {
                                logged = true;
                                alert("Yahoo");
                                this.navigate();
                            }
                            else {
                                logged = false;
                            }
                        } else {
                            // doc.data() will be undefined in this case
                            console.log("No such document!");
                        }
                    }).catch(function (error) {
                        console.log("Error getting document:", error);
                    });
             })
            .catch(error => {
                alert(error);
                this.setState({ error });
            });
        if (logged) {
            alert(logged);
        }
        else {
            alert("Nope");
        }
    }
    else {
        alert("Enter all fields data");
    }
}
Frank van Puffelen
  • 418,229
  • 62
  • 649
  • 645
amna iqbal
  • 13
  • 1
  • 2

1 Answers1

1

Don't use normal function, you are going to lose the context of this. The this in the callback function is not pointing to your class. So this.navigate() line of code won't work

.then(function (doc) {

As a solution, Use arrow function. 

...
.then((doc) => {
...
gdh
  • 10,036
  • 2
  • 5
  • 19
  • Ok i get it, but this.props.history.push('./') is also not working. Can you point out why? – amna iqbal Jun 01 '20 at 14:09
  • i see - i couldn't find it in your code snippet ... the isssue might be the same or you might be using history prop in the component which is not falling under router.... can you please post a new question on that by sharing litle info and code... – gdh Jun 01 '20 at 14:20
  • On console.log I am getting an error: Error getting document TypeError: Cannot read property 'push' of undefined – amna iqbal Jun 01 '20 at 14:49
  • okay - you are surely using history in non-router component... so put ur component between routers ... or simply use withRouter.... see [here](https://stackoverflow.com/questions/44009618/uncaught-typeerror-cannot-read-property-push-of-undefined-react-router-dom) , and also [here](https://stackoverflow.com/questions/39184049/react-router-cannot-read-property-push-of-undefined) and [here](https://stackoverflow.com/questions/52422332/cannot-read-property-push-of-undefined-in-react) ... good luck – gdh Jun 01 '20 at 14:56
  • Thankyou so much sir. – amna iqbal Jun 01 '20 at 15:07