I created a signup page in my Vue app where users can input their information. Once the input is validated, I use firebase auth to add the user. Upon successful sign up, I want the page to automatically navigate to the login page. Here is the code for my signup page:
<template>
<div class="signup container">
<form @submit.prevent="signup" class="card-panel">
<h2 class="center teal-text">Signup</h2>
<div class="field">
<label for="firstName">First Name:</label>
<input type="text" name="firstName" v-model="firstName">
</div>
<p class="red-text center" v-if="firstNameFeedback"> {{firstNameFeedback}} </p>
// Other form fields...
<div class="field center">
<button class="btn deep-teal">Signup</button>
</div>
</form>
</div>
</template>
// Script section...
</style>
In the code snippet provided, I handle errors from the createUserWithEmailAndPassword() method within the catch block. However, despite this setup, the page redirects to the login page first and only then executes the error handling logic. This is evident as the error message appears in the console after the redirection. Any assistance on resolving this issue would be greatly appreciated. Thank you.