vue js导航到带问号的url

Question

我的Vue js项目登录模板点击按钮,它重定向到这样

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

两个Url都显示界面.
1st Url未设置本地存储变量'token'.
第二个Url设置为本地存储变量'token'.
怎么解决？

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>

Answer 1

表单将作为您在表单中提供的按钮提交,type="submit"即使您不添加属性,这是表单中存在的按钮的默认行为type="button"

所以将类型提交替换为按钮o阻止表单提交如下:

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

Answer 2

我刚刚遇到了同样的问题，并且提供的解决方案对我不起作用（Vue 2.5.17）。

我必须向事件添加修饰符@click以防止默认行为：

<button class="btn btn-primary" @click.prevent="login">Login</button>