vue-router安装

vue-router安装

在项目的根目录打开终端
通过命令npm install vue-router下载

npm install vue-router

然后在main . js 中
1.导入

import VueRouter from 'vue-router'

2. use一下

Vue.use(VueRouter)

3.创建路由

let router=new VueRouter({
import discovery from './components/03.discovery.vue'
import playlists from './components/04.playlists.vue'
//创建路由
let router = new VueRouter ( {
routes:[
//配置地址和组件的对应关系
{
//地址
path:"/discovery",
//组件
component:discovery
}，
{
//地址
path:"/playlists",
//组件
component:playlists
}]
})

4.挂载到Vue实例上

new Vue({
render:h=>h(App),
//挂载到Vue实例上
router//router:router
}). $mount('#app')

最后在main.js配置
1.导入组件
2.routes属性中进行配置关系
3.path:设置地址
4.component:设置组件
5.可以配置多个

记住在要显示的组件配置出口

<router-view></router-view>