vue路由

路由的基本使用

1、安装

yarn add vue-router@3.5.3

2、准备工作（3步）在main.js下

2.1、引入路由

import VueRouter from 'vue-router'
Vue.use(VueRouter)

2.2、创建实例

const router=new VueRouter()

2.3、挂载

new Vue({
  router,
  render: h => h(App),
}).$mount('#app')

3、具体步骤（3步）

3.1、入口

方案一：手写：在搜索栏加上‘/文件路径’

方案二：声明式导航

<router-link to="/one">one</router-link>
<router-link to="/two">two</router-link>

3.2、规则main.js

import One from '@/components/One.vue'
import Two from '@/components/Two.vue'

const router=new VueRouter({
  routes:[
    { path: '/one', component: One },
    { path: '/two', component: Two },
  ]
})

3.3、出口

<router-view></router-view>