<RedirectToSignUp />
The <RedirectToSignUp /> component will navigate to the sign up URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack.
import {
ClerkProvider,
SignedIn,
SignedOut,
RedirectToSignUp,
UserButton,
} from '@clerk/react-router'
// Import your Publishable Key
const PUBLISHABLE_KEY = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
if (!PUBLISHABLE_KEY) {
throw new Error('Add your Clerk Publishable Key to the .env file')
}
function PrivatePage() {
return (
<ClerkProvider publishableKey={PUBLISHABLE_KEY}>
<SignedIn>
<UserButton />
</SignedIn>
<SignedOut>
<RedirectToSignUp />
</SignedOut>
</ClerkProvider>
)
}- Name
signUpFallbackRedirectUrl?- Type
string- Description
The fallback URL to redirect to after the user signs up, if there's no
redirect_urlin the path already. Defaults to/. It's recommended to use the environment variable instead.
- Name
signUpForceRedirectUrl?- Type
string- Description
If provided, this URL will always be redirected to after the user signs up. It's recommended to use the environment variable instead.
- Name
initialValues- Type
SignUpInitialValues- Description
The values used to prefill the sign-up fields with.
Feedback
Last updated on