路由原理
传统开发方式 url改变后 立刻发起请求,响应整个页面,渲染整个页面
SPA 锚点值改变后 不会发起请求,发起ajax请求,局部改变页面数据
页面不跳转 用户体验更好
SPA
single page application(单页应用程序)
前端路由
锚点值监视
ajax获取动态数据
核心点是锚点值
前端框架 Vue/angular/react都很适合开发单页应用
基本使用
vue-router
其是vue的核心插件
1:下载 npm i vue-router -S
1.5(重要):安装插件Vue.use(VueRouter);
2:在main.js中引入vue-router对象 import VueRouter form './x.js';
3:创建路由对象 var router = new VueRouter();
4:配置路由规则 router.addRoutes([路由对象]);
路由对象{path:'锚点值',component:要(填坑)显示的组件}
5:将配置好的路由对象交给Vue
在options中传递-> key叫做 router
6:留坑(使用组件)
router-link
to点我
帮助我们生成a标签的href
锚点值代码维护不方便,如果需要改变锚点值名称
则需要改变 [使用次数 + 1(配置规则)] 个地方的代码
命名路由
1:给路由对象一个名称 { name:'home',path:'/home',component:Hom