Skip to content

useAuth

Category
Export Size
164 B
Package
@vueuse/firebase
Last Changed
last year

响应式的 Firebase Auth 绑定。它提供了一个响应式的 userisAuthenticated,因此您可以轻松地对用户的身份验证状态变化做出反应。 Available in the @vueuse/firebase add-on.

用法

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

const app = initializeApp({ /* 配置 */ })
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">
      使用 Google 登录
    </button>
  </div>
</template>

类型声明

显示类型声明
typescript
export interface UseFirebaseAuthOptions {
  isAuthenticated: ComputedRef<boolean>
  user: Ref<User | null>
}
/**
 * 响应式 Firebase 身份验证绑定
 *
 * @see https://vueuse.org/useAuth
 */
export declare function useAuth(auth: Auth): {
  isAuthenticated: ComputedRef<boolean>
  user: Ref<{
    readonly emailVerified: boolean
    readonly isAnonymous: boolean
    readonly metadata: {
      readonly creationTime?: string | undefined
      readonly lastSignInTime?: string | undefined
    }
    readonly providerData: {
      readonly displayName: string | null
      readonly email: string | null
      readonly phoneNumber: string | null
      readonly photoURL: string | null
      readonly providerId: string
      readonly uid: string
    }[]
    readonly refreshToken: string
    readonly tenantId: string | null
    delete: () => Promise<void>
    getIdToken: (forceRefresh?: boolean | undefined) => Promise<string>
    getIdTokenResult: (
      forceRefresh?: boolean | undefined,
    ) => Promise<IdTokenResult>
    reload: () => Promise<void>
    toJSON: () => object
    readonly displayName: string | null
    readonly email: string | null
    readonly phoneNumber: string | null
    readonly photoURL: string | null
    readonly providerId: string
    readonly uid: string
  } | null>
}

Source

SourceDocs

贡献者

Anthony Fu
Jacob Clevenger
丶远方
Kevin Story
Steven Yung
ordago

变更日志

No recent changes

Released under the MIT License.

Build faster with AI
New Masterclass to help you leverage AI in your Vue workflow.
Get Early Access