1.19

69 阅读1分钟

路由

理解: 一个路由(route)就是一组映射关系(key - value),多个路由需要路由器(router)进行管理。

前端路由:key是路径,value是组件。

1.基本使用

安装vue-router,命令:npm i vue-router

应用插件:Vue.use(VueRouter)

编写router配置项 :

//引入VueRouter

import VueRouter from 'vue-router'

//引入Luyou 组件

import About from '../components/About'

import Home from '../components/Home'

//创建router实例对象,去管理一组一组的路由规则

const router = new VueRouter({

routes:[

{

path:'/about',

component:About

},

{

path:'/home',

component:Home

}

]

})

\

配置路由规则,使用children配置项:

routes:[

{

path:'/about',

component:About,

},

{

path:'/home',

component:Home,

children:[ //通过children配置子级路由

{

path:'news', //此处一定不要写:/news

component:News

},

{

path:'message',//此处一定不要写:/message

component:Message

}

]

}

]