Question

我使用vue-router和vue-cli设置了我的Vue 2.0项目。我的项目中的每个页面都是一个单独的.vue组件，它们通过路由连接在一起。

这是我的router/index.js

import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/Login/Login'
import Component1 from '@/components/Component1/Component1'
import Component2 from '@/components/component2/component2'

Vue.use(Router)

const router = new Router({
  history : false,
  routes: [
    {
      path: '/',
      name: 'Login',
      component: Login
    },
    {
      path : '/component1',
      name : 'Component1',
      component : Component1
    },
    {
      path : '/component2',
      name : 'Component2',
      component : Component2
    },
    {
      path : '*',
      redirect : '/'
    }
  ]
});

当我使用npm run dev命令运行项目时，它会按照预期在URL localhost:8080/#/中加载登录页面。

问题：

在登录页面输入我的用户名和密码后，该应用程序会将我重定向到URL localhost:8080/?#/的同一登录页面。注意哈希之前的问号。此时我不得不再次输入我的用户名和密码，以便将其路由到正确的URL（在本例中为localhost:8080/?#/component1等）。

当我直接转到网址localhost:8080/?#/时，就不会出现此问题。我该如何解决这个问题？我不希望用户两次输入凭据。

Answer 1

我在看到Daniel的评论后，通过在我的登录页面中用<form>替换<div>来解决问题。

Vue-router似乎没有在页面加载时加载默认路由

1 个答案: