useSessionList()
The useSessionList() composable returns an array of Session objects that have been registered on the client device.
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 and/or organization.
- Name
sessions- Type
Ref<Session>- Description
A list of sessions that have been registered on the client device.
- 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 useSessionList() composable
Get a list of sessions
The following example uses useSessionList() to get a list of sessions that have been registered on the client device. The sessions property is used to show the number of times the user has visited the page.
<script setup>
import { useSessionList } from '@clerk/vue'
const { isLoaded, sessions } = useSessionList()
</script>
<template>
<div v-if="!isLoaded">
<!-- Handle loading state -->
</div>
<div v-else>
<p>Welcome back. You've been here {{ sessions.length }} times before.</p>
</div>
</template>Feedback
Last updated on