useAuth

类别

@Firebase

导出大小

155 B

包

@vueuse/firebase

最近修改

2 days ago

响应式 Firebase Auth 绑定。它提供了一个响应式的 user 和 isAuthenticated，让你可以轻松地对用户认证状态的变化作出反应。

🌐 Reactive Firebase Auth binding. It provides a reactive user and isAuthenticated so you can easily react to changes in the users' authentication status. Available in the @vueuse/firebase add-on.

用法

🌐 Usage

<script setup lang="ts">
import { useAuth } from '@vueuse/firebase/useAuth'
import { initializeApp } from 'firebase/app'
import { getAuth, GoogleAuthProvider, signInWithPopup } from 'firebase/auth'

const app = initializeApp({ /* config */ })
const auth = getAuth(app)
const { isAuthenticated, user } = useAuth(auth)

const signIn = () => signInWithPopup(auth, new GoogleAuthProvider())
</script>

<template>
  <pre v-if="isAuthenticated">{{ user }}</pre>
  <div v-else>
    <button @click="signIn">
      Sign In with Google
    </button>
  </div>
</template>

返回值

🌐 Return Values

名称	类型	描述
user	Ref<User | null>	当前的 Firebase 用户，如果未认证，则为 null
isAuthenticated	ComputedRef<boolean>	用户当前是否已认证

当用户的 ID 令牌发生变化时（包括登录、注销和令牌刷新事件），该可组合函数会使用 Firebase 的 onIdTokenChanged 监听器自动更新。

🌐 The composable automatically updates when the user's ID token changes (including sign-in, sign-out, and token refresh events) using Firebase's onIdTokenChanged listener.