Vue.js - Login Form on submit append Question Mark (?) to the URL

Question

My login form behavior weird lately. I started off with http://app.test/#/

When I login, rather than login me in, redirect me to : http://app.test/?#/

Only when I clicked login here, then, I will be able to login.

What caused that extra redirect with ? ? Is this something that Vue.js added ? Or something I need to fix on the web server level ?

<v-form ref="form" v-model="valid" lazy-validation class="pa-15" v-on:keyup.enter="onEnterClick">
    <v-text-field class="mb-5" v-model="email" :rules="emailRules" label="Email" required></v-text-field>
    <v-text-field
        :append-icon="show1 ? 'mdi-eye' : 'mdi-eye-off'"
        @click:append="show1 = !show1"
        :type="show1 ? 'text' : 'password'"
        class="mb-5"
        v-model="password"
        :rules="passwordRules"
        label="Password"
        required
    ></v-text-field>
    <v-btn type="submit" block :disabled="!valid" color="info" class="mr-4 mb-5" @click="validate"> Continue </v-btn>

    <router-link to="/forgot-password">
        <button class="black--text caption">Forgot Password?</button>
    </router-link>
</v-form>

Answer 1

That's probably being caused by submitting the form and have either no action attribute, or an empty one (because it's not needed in this case since the login will take place using an AJAX call).

You can add the prevent modifier to the form submit handler (assuming that you have one), like so: <form @submit.prevent="myLoginFunction">. That should stop it from doing that.