Vue+ElementUI项目笔记(二、配置路由)

components

在components文件夹下新建vue文件:

login.vue welcome.vue home.vue

index.js ======单级路由

import Vue from 'vue'

import Router from 'vue-router'

import Login from '@/components/Login'

import Welcome from '@/components/Welcome'

import Home from '@/components/Home'

Vue.use(Router)

export const router = new Router({

routes: [

        {

           path: '/login',

           name: 'Login',

           component: Login,

        },

        {

            path: '/',

            name: 'Welcome',

            component: Welcome,

            meta: { requiresAuth: true },

            }

     ]

})

pages

在pages文件夹下新建:

文件夹home,在home下新建:index.vue add.vue search.vue

index.js ======多级路由

import Home from '@/pages/home/index'

import HomeAdd from '@/pages/home/add'

import HomeSearch from '@/pages/home/search'

{

  path: '/Home/:type',

  component: Home,

   children: [

                        { path: "add", component: HomeAdd, name:"HomeAdd" },

                        { path: "search", component: HomeSearch, name:"HomeSearch"}

                   ]

}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容