文档章节

Vue-router2学习笔记

龙马行空
 龙马行空
发布于 2017/03/02 23:28
字数 530
阅读 127
收藏 1

vue-router学习

1. vue-router介绍

2. 路由的快速开始

  • 定义各页面容器组件

  • 定义路由配置文件

  • 在入口文件添加路由配置信息

  • 修改跟组件页面信息

  • 接下来可以启动项目查看路由跳转

3. 路由基础知识介绍

3.1. 动态路由

  • 你可以通过:给一个路由添加参数
  • 之后在组件中通过this.$route.params.参数名获取
  • 当路由参数发生变化的时候,组件不会被卸载而是复用,这也意味着组件的生命周期钩子不会再被调用,那么你只能监听$routes实例属性知道路由发生了变化

3.2. 嵌套路由

  • 如果有嵌套路由,要用children属性去配置,路由路径会自动拼接
  • 可以给一个页面初始化一个组件用空路由实现

3.3. 用代码进行路由跳转

  • 在组件中你可以通过this.$router获取路由对象

3.4. 命名路由

  • 有时候,通过一个名称来标识一个路由显得更方便一些,特别是在链接一个路由,或者是执行一些跳转的时候。你可以在创建Router实例的时候,在routes配置中给某个路由设置名称。

3.5. 命名视图

  • 在跳转一个路由的时候可以同时渲染页面中的多个坑

3.6. 重定向和别名

  • 当路由路径太深的时候,你可以给路由起一个别名,那么通过别名和访问太深的路由的页面渲染效果是一样的

3.7. 三种history

4. 进阶知识点

5. 导航钩子

 

© 著作权归作者所有

共有 人打赏支持
龙马行空
粉丝 388
博文 127
码字总数 119251
作品 0
房山
前端工程师
私信 提问
加载中

评论(2)

龙马行空
龙马行空

引用来自“汤免费”的评论

vue服务端端渲染怎么实现啊?

回复@汤免费 :稍等几天,马上弄上来
汤免费
汤免费
vue服务端端渲染怎么实现啊?
搭建 vue2 单元测试环境(karma+mocha+webpack3)

从网上找了很多例子关于单元测试,都是如何新建项目的时候的添加单元测试,用vue-cli中怎么添加,但是我的项目已经生成了,不能再一次重新初始化,这时如何添加单元测试,这里面遇到了好多坑...

nxmin
2018/05/23
0
0
Vue.js构建项目笔记1:vue-cli

一.一些简单的话 如果你学习或者使用过angularjs(1.x),你就会非常了解指令的使用,如:ng-click ng-if ng-show ng-src。当然还有控制器和各种服务。 如果你学习或者使用过react,你就会非...

透笔度
2017/10/18
0
0
搭建 vue2 单元测试环境(karma+mocha+webpack3)

从网上找了很多例子关于单元测试,都是如何新建项目的时候的添加单元测试,用vue-cli中怎么添加,但是我的项目已经生成了,不能再一次重新初始化,这时如何添加单元测试,这里面遇到了好多坑...

mgbq
2018/05/23
0
0
Vuejs2.0学习笔记之axios&vue-resource

在Vue中发送AJAX请求:Vue本身并不支持发送ajax请求,需要使用第三方插件vue-resources(1.0, 但是2.0中不建议使用)、官方推荐使用axis(2.0);但是也可以用jQuery; 什么是axios?axios是一个基...

码农严选
03/01
0
0
vue通过ajax获取数据踩坑笔记

跨屏网专注一句话JS解决网站移动适配问题,所以除了前端以外,还需要涉及程序开发的部分,而最近流行的vue框架也在内,初次使用vue的时候难免出问题,比如vue通过ajax获取数据的时候,如果不...

蓬门网
2017/12/24
0
0

没有更多内容

加载失败,请刷新页面

加载更多

基于 DataLakeAnalytics 的数据湖实践

随着软硬件各方面条件的成熟,数据湖(Data Lake)已经越来越受到各大企业的青睐, 与传统的数仓实践不一样的是,数据湖不需要专门的“入仓”的过程,数据在哪里,我们就从哪里读取数据进行分析...

迷你芊宝宝
29分钟前
1
0
ubuntu查看防火墙状态

1.查看防火墙当前状态 sudo ufw status 2.开启防火墙 sudo ufw enable 3.关闭防火墙 sudo ufw disable 4.查看防火墙版本 sudo ufw version 5.默认允许外部访问本机 sudo ufw default all...

Frost729
31分钟前
1
0
Gradle插件使用过程记录

Android中基于Gradle进行编译打包的过程,下面记录一下如何进行Gradle插件开发的过程: 首先在项目中新建的一个名为buildSrc的module,为什么叫这个名字请看官方文档。然后将Java文件夹以及r...

JerryLin123
37分钟前
1
0
RSA 2019安全大会:企业资产管理成行业新风向标,云上安全占优势

美国时间3月4-8日,国际知名信息安全峰会RSA Conference在美国旧金山开幕,云安全及云可以为企业提供更可靠的资产管理方式成为大会热点。 此次峰会共吸引全球700多家机构参展,其中近42%为云...

阿里云云栖社区
38分钟前
2
0
重磅推出TabLayout高级窗口组件

TabLayout是在APICloud现有窗口系统基础上升级而来的高级窗口组件,符合Material Design规范,可通过简单的配置为窗口实现原生的导航栏和TabBar,它将帮助您节省30%以上的重复编码工作量,同...

API_Cloud
43分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部