useSignUp()
The useSignUp() composable provides access to the SignUp object, which allows you to check the current state of a sign-up attempt and manage the sign-up flow. You can use this to create a custom sign-up flow.
Returns
- Name
isLoaded- Type
Ref<boolean>- Description
A boolean that indicates whether Clerk has completed initialization. Initially
false, becomestrueonce Clerk loads.
- Name
setActive()- Type
Ref<(params: SetActiveParams) => Promise<void>>- Description
A function that sets the active session.
- Name
signUp- Type
Ref<SignUp>- Description
An object that contains the current sign-up attempt status and methods to create a new sign-up attempt.
- Name
session- Type
Session | string | null- Description
The session resource or session ID (string version) to be set as active. If
null, the current session is deleted.
- Name
organization- Type
Organization | string | null- Description
The organization resource or organization ID/slug (string version) to be set as active in the current session. If
null, the currently active organization is removed as active.
- Name
beforeEmit?- Type
(session?: Session | null) => void | Promise<any>- Description
Callback run just before the active session and/or organization is set to the passed object. Can be used to set up for pre-navigation actions.
How to use the useSignUp() composable
Check the current state of a sign-up
The following example uses the useSignUp() hook to access the SignUp object, which contains the current sign-up attempt status and methods to create a new sign-up attempt. The isLoaded property is used to handle the loading state.
<script setup>
import { useSignUp } from '@clerk/vue'
const { isLoaded, signUp } = useSignUp()
</script>
<template>
<div v-if="!isLoaded">
<!-- Handle loading state -->
</div>
<div v-else>The current sign-up attempt status is {{ signUp?.status }}.</div>
</template>Feedback
Last updated on