[Vuejs]-DisplayName always returns null after creating account

4👍

This is because the updateProfile() method is asynchronous and does not trigger the listener set through onAuthStateChanged().

So when the onAuthStateChanged() listener is triggered right after the user is created (and signed in, because after the creation of the user account, the user is also signed in) the value of displayName is not yet updated.

You should probably update the State in your Vuex Store when the promise returned by the updateProfile() method is resolved.

Something along the following lines:

  firebase
    .auth()
    .createUserWithEmailAndPassword(this.user.email, this.user.password)
    .then((res) => {
      return res.user.updateProfile({
        displayName: this.user.username,
      });
    })
    .then(() => {
      //Update the Vuex Store here with firebase.auth().currentUser
      console.log(firebase.auth().currentUser.displayName);
    })
    .catch((error) => {
      this.error = error.message;
      console.log('err', error);
    });

Leave a comment