一、vue-router路由
1、简介:
使用vue开发单页面SPA(single page application) 当页面应用
根据不同的url地址,显示不同的内容,但显示在同一个页面中,称之为当页面
【参考】:https://router.vuejs.org/zh/
bower info vue-router //查看版本
cnpm install vue-router -S //下载
2、基本用法
a)、页面布局
b)、配置路由
3、路由嵌套和参数传递
传参的两种形式
a.查询字符串:login?name=tom&pwd=123 取参:$route.query
b.rest风格url:regist/alice/456
路由中定义参数:register/:name/:pwd
取参:$route.params
4、路由实例的方法
router.push()//添加路由,功能上与<route-link>相同
router.replace()替换路由,不产生历史记录
5、路由结合动画 animation.css
<transition enter-active-class="animated bounceInLeft" leave-active-class="animated bounceOutRight"> <!--显示路由内容--> <router-view></router-view> </transition>
二、模块化开发
1、vue-router 模块化开发
cnpm install vue-router -S
2、axios 模块化
cnpm install axios -S
使用axios的两种方式:
方式1:在每个组件中引入axios
方式2:在main.js 中全局引入axios并添加到vue原型中