vue js navigate to url with question mark

Asked By: Anonymous

my Vue js project login template click button it redirects to like this

http://localhost:8080/#/login to http://localhost:8080/?#/login

both Url show interface.
1st Url not set the local storage variable ‘token’.
2nd Url is set the local storage variable ‘token’.
how to solve it?

Login.vue

<template>
    <div class="row col-sm-12">
        <form>
            <div class="form-group">
                <label>Email address:</label>
                <input type="email" class="form-control" v-model="email">
            </div>
            <div class="form-group">
                <label>Password:</label>
                <input type="password" class="form-control" v-model="password">
            </div>
            <div class="checkbox">
                <label><input type="checkbox"> Remember me</label>
            </div>
            <button @click="login" type="submit" class="btn btn-success">Submit</button>
        </form>
    </div>


</template>

<script>
    export default{
        data(){
            return{
                email:'',
                password:''
            }
        },
        methods: {
            login(){
                var data  = {
                    email:this.email,
                    password:this.password
                }
                this.$http.post("api/auth/login",data)
                    .then(response =>  {
                        this.$auth.setToken(response.body.token)
                       // console.log(response)
                    })
            }

        }
    }
</script>

Solution

Answered By: Anonymous

The form is getting submitted as the button you have provided in the form has type="submit" which is the default behaviour of a button present inside form even if you do not add the attribute type="button"

So replace the type submit to button o prevent form submission like this:

<button @click="login" type="button" class="btn btn-success">Submit</button>
techinplanet staff

techinplanet staff


Windows 10 Kaufen Windows 10 Pro Office 2019 Kaufen Office 365 Lizenz Windows 10 Home Lizenz Office 2019 Home Business Kaufen windows office 365 satın al follower kaufen instagram follower kaufen porno