NUXT 3 onload等待OnauthstateChange

发布于 2025-02-11 16:54:41 字数 1088 浏览 1 评论 0原文

我试图在我的应用程序中使用NUXT 3,PINIA和FIREBASE在AUTH TRAASTACTION上使用

AuthStateChange,除非我刷新页面,否则一切都很好。在这种情况下,我会延迟延迟,直到加载来自firebase的当前用户数据并将其设置为Pinia Store。

此时我在哪里运行OnauthstateChange。如果有用户,我会在状态上设置数据,然后将该商店返回为Promisse

currentUser() {
  const auth = getAuth()
  return new Promise((resolve, reject) => {
    onAuthStateChanged(auth, (user) => {
      if (user) {
        console.log("user", user)
        resolve(user)
        this.setUser(user)
      } else {
        console.log("no user")
        resolve(undefined)
      }
    })
  })
},

,并且,

export default defineNuxtPlugin((nuxtApp) => {
    const store = useAuthStore()
    store.currentUser()
})

我的问题是。在加载全部之前,如何使我的应用程序等待此交易?

这只是我使用getter显示或不显示登录表单的一个例子。该表格是在开始时出现的,然后如果用户为loggedin,则将其删除。

<form-signin v-if="!store.loggedin" />
<div v-else>already logged as {{ store.userData.email }}</div>

im trying to use nuxt 3, pinia and firebase on auth transaction in my application

everything is working fine about onAuthStateChange except when I refresh a page. in this case im getting a kind of delay until load the current user data from firebase and set it with pinia store.

At this time i have a store, where i run onAuthStateChange. if has user, I set the data on state, and return this store as a Promisse

currentUser() {
  const auth = getAuth()
  return new Promise((resolve, reject) => {
    onAuthStateChanged(auth, (user) => {
      if (user) {
        console.log("user", user)
        resolve(user)
        this.setUser(user)
      } else {
        console.log("no user")
        resolve(undefined)
      }
    })
  })
},

and, I have a plugin, called init, where i call this store.

export default defineNuxtPlugin((nuxtApp) => {
    const store = useAuthStore()
    store.currentUser()
})

my question is. how can i make my application wait for this transaction before loading all?

just one example of what this cause, is where i using a getter to show or not a login form. the form is appearing in begining, and then desappear if user is loggedin.

<form-signin v-if="!store.loggedin" />
<div v-else>already logged as {{ store.userData.email }}</div>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文