<p>Je développe une application Web utilisant Vue 3 et le framework Firebase. En guise de stroe, j'utilise Pinia. Pour l'authentification, j'utilise Firebase et jusqu'à présent, cela fonctionne très bien, les utilisateurs peuvent s'inscrire et se connecter. Une fois qu'un utilisateur se connecte, ses données sont stockées dans le stockage Pinia. </p> <p>Cependant, une fois que l'utilisateur se connecte et recharge la page, les données stockées dans le stockage Pinia sont perdues. Si j'utilise la fonction Firebase <code>onAuthStateChanged()</code> </p> <p>Ma première solution consistait à appeler la fonction <code>onAuthStateChanged()</code> à chaque fois que l'application est lancée et que le magasin pinia est rempli avec les données requises. J'ai essayé d'appeler la fonction <code>onAuthStateChanged()</code> dans le fichier de configuration Firebase, mais le magasin pinia n'y a pas encore été initialisé. </p> <p>À quel moment de l'application Vue dois-je appeler la fonction <code>onAuthStateChanged()</code> afin que l'utilisateur soit automatiquement connecté après une actualisation et que je puisse écrire les données utilisateur sur le stockage Pinia ? </p>

import { getAuth, onAuthStateChanged } from 'firebase/auth';

const auth = getAuth();
onAuthStateChanged(auth, async () => {
  const store = useStore();
  store.setUser();
});


const useStore = defineStore('store', {
  state: () => ({ 
    user: null
  }),
  actions: {
    setUser() {
      // Set user here
      // this.user = ...
    }
  }
});