useWeb3Auth

Composable to access the Embedded Wallets/Web3Auth context in Vue.

Import

import { useWeb3Auth } from '@web3auth/modal/vue'

Usage

<script setup lang="ts">
  import { useWeb3Auth } from '@web3auth/modal/vue'

  const { web3Auth, isConnected, isInitializing, connection, status, initError } = useWeb3Auth()

  watchEffect(() => {
    if (isConnected.value) {
      console.log('Connected via:', connection.value?.connectorName)
    }
    if (isInitializing.value) {
      console.log('Web3Auth is initializing')
    }
    if (connection.value?.ethereumProvider) {
      console.log('Ethereum provider available')
    }
    if (status.value) {
      console.log('Web3Auth status:', status.value)
    }
    if (initError.value) {
      console.log('Web3Auth initialization error:', initError.value)
    }
  })
</script>

info

For EVM wallet operations, use Wagmi composables after setting up WagmiProvider. Use connection.ethereumProvider only for JSON-RPC methods Wagmi does not cover. See the Web SDK v11 migration guide.

Return type

import type { IUseWeb3Auth } from '@web3auth/modal/vue'

connection

Ref<{ ethereumProvider, solanaWallet, connectorName } | null>

Active wallet connection after sign-in.

initError

Ref<Error | null>

Error that occurred during Web3Auth initialization.

isConnected

Ref<boolean>

Whether the user is connected to Web3Auth.

isInitialized

Ref<boolean>

Whether Web3Auth has completed initialization.

isInitializing

Ref<boolean>

Whether Web3Auth is currently initializing.

status

Ref<string>

Current status of the Web3Auth connection.

web3Auth

Ref<Web3Auth>

The Web3Auth instance.

getPlugin

(pluginName: PLUGIN_NAME) => IPlugin | null

Helper function to get a plugin by name.