vue 固定头位，但是现在要做一个单独的登陆页面，求解？

Question

如图：需要登陆页面单独显示，现在都在头尾中间

====

router.js

import Vue from 'vue'
import Router from 'vue-router'
import Index from '../components/index'
import Classify from '../components/classify'
import Cart from '../components/cart'
import Center from '../components/center'
import Login from '../components/welcome'
Vue.use(Router)

export default new Router({
    mode: 'history',
  routes: [
    {
      path: '/welcome',
      component: Login
    },
    {
      path: '/',
      component: Index
    },
    {
      path: '/classify',
      component: Classify
    },
    {
      path: '/cart',
      component: Cart
    },
    {
      path: '/center',
      component: Center
    }
  ]
})

Answer 1

import Vue from 'vue'
import Router from 'vue-router'
import Index from '../components/index'
import Classify from '../components/classify'
import Cart from '../components/cart'
import Center from '../components/center'
import Login from '../components/welcome'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/login',
      component: Login // 登录页面
    },
    {
      path: '',
      component: App, // 原来的 App.vue
      children: [
        {
          path: '/welcome',
          component: Login
        },
        {
          path: '/',
          component: Index
        },
        {
          path: '/classify',
          component: Classify
        },
        {
          path: '/cart',
          component: Cart
        },
        {
          path: '/center',
          component: Center
        }
      ]
    }
  ]
})

App.vue 换成

<template>
  <router-view />
</template>

参考: https://router.vuejs.org/zh-c...

Answer 2

不要SPA，login独立出来做一个页面

Answer 3

可以判断当前路由，用vuex去控制头尾的显示