一.简介
路由就是一种映射关系
Vue中的路由就是组建的映射关系
使用路由的优缺点:优点整体不刷新页面,用户体验更好,数据传递容易开发效率高
缺点:开发成本高需要学习专门知识(现在不存在了都是由前端完成),首次加载会比较慢,不利于seo
二.基本使用
当然后面可以创建Vue脚手架的时候一键创建前一篇文章有说明。
三.声明式导航
import Vue from 'vue'
import App from './App.vue'
import Find from './views/Find.vue'
import My from './views/My.vue'
import Part from './views/Part.vue'
// 导包
import VueRouter from 'vue-router'
Vue.config.productionTip = false
//安装VueRouter
Vue.use(VueRouter)
//创建路由规则
const routes = [{
path: '/find',
component: Find
},
{
// 冒号参数名
path: '/my/:name',
component: My
},
{
path: '/part',
component: Part
},
]
//创建路由对象,传入路由规则
const router = new VueRouter({
routes
})
new Vue({
router,
render: h => h(App)
}).$mount('#app')
<