vuecli3第一次加载页面点击进行路由跳转第一次点击页面闪一下第二次点击才跳转

Question

router.js

import Vue from 'vue'
import Router from 'vue-router'
import SignIn from './views/signIn.vue'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'signIn',
      component: SignIn
    },
    {
      path: '/home',
      name: 'home',
      component: () => import('./views/home.vue')
    }
  ]
})

跳转代码

<button class="loginBtn" @click="signin">登录</button>
            
    signin() {
      this.$router.push({
        name: "home"
      });
    },

第一次进入页面地址栏显示

然后第一次点击按钮地址栏多了个“？”号，但是并没有进行跳转

第二次点击按钮跳转成功

Answer 1

已解决我把登录按钮写在了form里面导致的这个情况

Answer 2

好吧...路由懒加载可以写成一个函数,感觉方便点
const getPage = page => () => import(../pages/${page}/${page}.vue)
使用时:
component: getPage('home'),

Answer 3

真的是，太感谢了，卡这个bug好几个小时，舒服了