router.js中的一个属性linkActiveClass

import Vue from 'vue';
import Router from 'vue-router';
import Login from './views//Login';
import Home from './views/Home';

Vue.use(Router);

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  //路由激活是给路由一个'active'属性
  linkActiveClass:'active',
  routes: [
    {
      path: '/',
      name: 'login',
      component: Login,
    },
    {
      path:'/home',
      name:'home',
      component:Home,
      children:[
        {
          path: 'list',
          name:'list',
          component: () => import(/* webpackChunkName: "list" */ './views/List.vue'),
        },
        {
          path: 'user',
          name:'user',
          component: () => import(/* webpackChunkName: "user" */ './views/User.vue'),
        }
      ]
    },
    {
      path: '/add',
      name: 'add',
      // route level code-splitting
      // this generates a separate chunk (about.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import(/* webpackChunkName: "add" */ './views/Add.vue'),
    },
    {
      path: '/about',
      name: 'about',
      // route level code-splitting
      // this generates a separate chunk (about.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      component: () => import(/* webpackChunkName: "about" */ './views/About.vue'),
    },
  ],
});

猜你喜欢

转载自blog.csdn.net/weixin_43837268/article/details/86133267
今日推荐