vueルーティングネスト

2851 ワード

1、router/index.jsのルーティング構成を再構築するには、children配列を使用してサブルーティングを定義する必要があります.具体的には、以下の通りです.
import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/Home'
import Brand from '@/Brand'
import Member from '@/Member'
import Cart from '@/Cart'
import Me from '@/Me'

import Collection from '@/Collection'
import Trace from '@/Trace'
import Default from '@/Default'

Vue.use(Router)

export default new Router({
  // mode: 'history',
  // base: __dirname,
  // linkActiveClass: 'active', //        Class 
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/brand',
      name: 'Brand',
      component: Brand
    },
    {
      path: '/member',
      name: 'Member',
      component: Member
    },
    {
      path: '/cart',
      name: 'Cart',
      component: Cart
    },
    {
      path: '/me',
      name: 'Me',
      component: Me,
      children: [
        {
          path: 'collection',
          name: 'Collection',
          component: Collection
        },
        {
          path: 'trace',
          name: 'Trace',
          component: Trace
        }
      ]
    }
  ]
})  

“/” , “/”;

, path , path path 。