初入Vue,手写路由跳转时的问题:

toXxxRoute: () => {
this.$router.push({'path': '/xxx', 'name': 'xxx'})
}

由于使用了箭头函数,this的指向与传统 js 里不同

所以报错

TypeError: Cannot read property '$router' of undefined

与其保持一个this变量,不如改回写 function 的方式

toXxxRoute: function(){
this.$router.push({'path': '/xxx', 'name': 'xxx'})
}

【Vue】【Router】手动跳转用 this.$router.push() 时 $router 未定义的问题的更多相关文章

  1. vue 中router.go;router.push和router.replace的区别

    vue 中router.go:router.push和router.replace的区别:https://blog.csdn.net/div_ma/article/details/79467165 t ...

  2. Vue之路由跳转 传参 aixos 和cookie

    一.路由跳转 1.1 项目的初始化 vue create m-proj   >>>创建vue项目 精简vue项目的 views 视图   About(基本是删除的) Home.(可以 ...

  3. vue项目中跳转到外部链接方法

    当我们在文件中,如果是vue页面中的内部跳转,可以用this.$router.push()实现,但是如果我们还用这种方法跳到外部链接,就会报错,我们一看链接的路径,原来是我们的外部链接前面加上了htt ...

  4. vue之vue-router跳转

    vue之vue-router跳转 一.配置 在初始化使用vue-cli的时候会有vue-router的安装选择,选择安装即可. 二.嵌套路由 一般情况下,登录和项目页面属于同级,所以App.vue 只 ...

  5. Vue.之.路由跳转

    Vue.之.路由跳转 在进行项目开发的过程中,需要使用路由进行跳转.如下: // 不带有参数,在页面上跳转到别的页面 1. this.$router.push('/login/init');  // ...

  6. Vue进行路由跳转的几种方式

    1.<router-link to="需要跳转到页面的路径"> 2.this.$router.push()跳转到指定的url,并在history中添加记录,点击回退返回 ...

  7. [Angular2 Router] Lazy Load Angular 2 Modules with the Router

    Angular 2 lazy loading is a core feature of Angular 2. Lazy loading allows your application to start ...

  8. vue当前路由跳转初步研究

    一样闲话少说,直接上问题,如图: 也是消息面板,没想到一个小小的消息面板,碰到这么多坑,惆怅. 就是如果当前路由和跳转路由不一样时,正常跳转没有任何问题.但是如果一样时,就不会跳转了,用了很多方法,比 ...

  9. Vue 实现手动刷新组件

    Vue 实现手动刷新组件:https://www.jianshu.com/p/742142dc95f3

随机推荐

  1. Java基本语法实验报告

      题目:       Java基本语法 课程名称:  JAVA语言程序设计 班    级:    信1705-1 姓    名:   刘雨馨     学号:   20173445 指导教师:    ...

  2. socketserver模块实现并发和连接合法性验证

    一.socketserver模块 1.sockeserver的源码流程 2.简单的使用 socketserver服务端 import socketserver class MyServer(socke ...

  3. django rest framemark

    一 内容回顾 1 开发者模式 普通开发方式:前后端放在一起开发 前后端分离:前后端只通过 JSON 来交流,组件化.工程化不需要依赖后端去实现 2 后端开发:为前端提供url接口,也就是API或者接口 ...

  4. 746. Min Cost Climbing Stairs

    两种方法,核心思想都一样,求出走到每一步上的最小开销,直到最后一步和倒数第二步,比较其最小值返回即可. 方法一,用一个辅助的容器 class Solution { public: int minCos ...

  5. Opencv(3):基本数据类型

    1.比较简单的原子类型 结构 成员 意义 CvPoint int x,y 图像中的点 CvPoint2D32f float x,y 二维空间中的点 CvPoint3D32f float x,y,z 三 ...

  6. 使用express框架和mongoose在MongoDB查找数据

    1.创建Schema var schema = new mongoose.Schema({ userName:{type:String,require:true}, age:{type:Number, ...

  7. ubuntu16.04无法关机解决方法

    11 down vote   In my case these simple steps worked for me fine: Press Ctrl+Alt+T to go to a termina ...

  8. python的6种基本数据类型--集合

    特征 1.确定性(元素必须可hash) 2.互异性(去重) 3.无序性(集合中的元素没有顺序,先后之分) >>> s = {1,1,1,2,2,3,4,5,6,7} # 创建 > ...

  9. IntelliJ IDEA 2017版 使用笔记(十一) Debug操作:IDEA 快捷键

    调试功能;            缩短项目时间,调高阅读源码的能力.   一.添加断点,选中一行代码,双击即可生成断点(快捷键:ctrl+F8)                二.单步运行,快捷键:s ...

  10. Attr类型

    Attr表示元素的特性,在所有浏览器中,都可以访问Attr类型的构造函数和原型. attr特性存在于元素的attributes属性中的节点 nodeType 2 nodeName 特性的名称 node ...