I have an error that is happening to me when authenticating with VueJS and Firebase. It is a simple application that when authenticating, should redirect me to the profile of the user and show me the data of it. But sometimes it shows me the data and sometimes it does not and it says this:
"Error: VueFire: invalid Firebase binding source."
Then he tells me:
[Vue warn]: Property or method "perfilUsuario" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See:
This is part of the profile script. vue, it's where I redirected the method once I logged in.
import firebase,{ auth } from 'firebase'
import mdb from '../config'
import toastr from 'toastr'
import Vue from 'vue'
import admin from 'firebase-admin'
import VueSession from 'vue-session'
import Router from 'vue-router'
let usuariosdb = mdb.ref('usuarios');
var vm = this;
var user = firebase.auth().currentUser;
var name,email,photoUrl,usersid,mascotasd;
console.log("USER : "+user);
firebase.auth().onAuthStateChanged(function(user,request) {
if (user) {
if (user != null) {
name = user.displayName;
email = user.email;
photoUrl = user.photoURL;
usersid = user.uid;
perfilUsuario=mdb.ref('perfilUsuariodb').child(usersid).child('usuarios');
}
}
});
if (user != null) {
name = user.displayName;
email = user.email;
photoUrl = user.photoURL;
usersid = user.uid;
perfilUsuario= mdb.ref('perfilUsuariodb').child(usersid).child('usuarios');
}
export default {
name: 'perfil',
firebase:{
usuariosdb:perfilUsuario
},
I'm sure the error is when you try to find the values of the logged in user with var user = firebase.auth().currentUser;
and can not find them, but when I render it several times it finds the value and the error disappears.
My question is, how do I get the user's values before:
firebase:{
usuariosdb:perfilUsuario
},