解决vue.js this.$router.push无效的问题


Posted in Javascript onSeptember 03, 2018

如下所示:

login() {
  if(this.email.length > 0 && this.password.length >0) {
   this.$http.post('/api/login', {
    user: this.email,
    password: this.password
   })
   .then(res => {
    let userPwd = res.data
    if(this.password == userPwd) {
     this.$router.push("/")
    } else {
     alert("错误,请重新输入!")
    }
   })
   .catch(err => {
    console.log(err)
   })
  } else {
   alert("输入错误!")
  }
  }

this.$router.push(“/”)不是跳转到主页,而是变成这样:http://127.0.0.1:8080/login?email=yejia%40qq.com&password=123456,请问哪里错啦?

解决方案1:

有没有可能是已经跳转了,但是主页判断成了没有登录,然后又跳回来了。

解决方案2:

你这里的 this指向已经不是 vue 的对象啦,可以这么改

login() {
 const self = this;
 if(this.email.length > 0 && this.password.length >0) {
  this.$http.post('/api/login', {
   user: this.email,
   password: this.password
  })
  .then(res => {
   let userPwd = res.data
   if(this.password == userPwd) {
    self.$router.push("/")
   } else {
    alert("错误,请重新输入!")
   }
  })
  .catch(err => {
   console.log(err)
  })
 } else {
  alert("输入错误!")
 }
 }

以上这篇解决vue.js this.$router.push无效的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Extjs学习过程中新手容易碰到的低级错误积累
Feb 11 Javascript
纯javascript实现四方向文本无缝滚动效果
Jun 16 Javascript
JS实现可关闭的对联广告效果代码
Sep 14 Javascript
使用JavaScriptCore实现OC和JS交互详解
Mar 28 Javascript
详解vue组件化开发-vuex状态管理库
Apr 10 Javascript
Node.js Mongodb 密码特殊字符 @的解决方法
Apr 11 Javascript
Vue render深入开发讲解
Apr 13 Javascript
JS实现仿微信支付弹窗功能
Jun 25 Javascript
javascript实现对话框功能警告(alert 消息对话框)确认(confirm 消息对话框)
May 07 Javascript
js中arguments对象的深入理解
May 14 Javascript
vue页面引入three.js实现3d动画场景操作
Aug 10 Javascript
Jquery Fade用法详解
Nov 06 jQuery
JavaScript封装的常用工具类库bee.js用法详解【经典类库】
Sep 03 #Javascript
基于vue-router 多级路由redirect 重定向的问题
Sep 03 #Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
Sep 03 #jQuery
Vue-router的使用和出现空白页,路由对象属性详解
Sep 03 #Javascript
Vue 通过自定义指令回顾v-内置指令(小结)
Sep 03 #Javascript
JavaScript日期工具类DateUtils定义与用法示例
Sep 03 #Javascript
Angular5中状态管理的实现
Sep 03 #Javascript
You might like
一行代码实现纯数据json对象的深度克隆实现思路
2013/01/09 Javascript
js中判断对象是否为空的三种实现方法
2013/12/23 Javascript
JavaScript代码复用模式详解
2014/11/07 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
举例讲解AngularJS中的模块
2015/06/17 Javascript
JQuery validate插件Remote用法大全
2016/05/15 Javascript
javascript正则表达式中分组详解
2016/07/17 Javascript
使用jQuery.Qrcode插件在客户端动态生成二维码并添加自定义Logo
2016/09/01 Javascript
assert()函数用法总结(推荐)
2017/01/25 Javascript
BootStrap Table前台和后台分页对JSON格式的要求
2017/06/28 Javascript
关于js中的鼠标事件总结
2017/07/11 Javascript
fastadmin中调用js的方法
2019/05/14 Javascript
Java Web开发过程中登陆模块的验证码的实现方式总结
2016/05/25 Python
Python实现向服务器请求压缩数据及解压缩数据的方法示例
2017/06/09 Python
Python查看微信撤回消息代码
2018/06/07 Python
Python实现自定义函数的5种常见形式分析
2018/06/16 Python
11个Python Pandas小技巧让你的工作更高效(附代码实例)
2019/04/30 Python
基于Django框架的权限组件rbac实例讲解
2019/08/31 Python
浅谈PyTorch中in-place operation的含义
2020/06/27 Python
Python实现哲学家就餐问题实例代码
2020/11/09 Python
利用Bootstrap实现漂亮简洁的CSS3价格表实例源码
2017/03/02 HTML / CSS
html5跨域通讯之postMessage的用法总结
2013/11/07 HTML / CSS
html5的自定义data-*属性与jquery的data()方法的使用
2014/07/02 HTML / CSS
canvas离屏技术与放大镜实现代码示例
2018/08/31 HTML / CSS
Melijoe美国官网:法国奢侈童装购物网站
2017/04/19 全球购物
Lookfantastic挪威官网:英国知名美妆购物网站
2017/07/26 全球购物
公务员个人自我评价分享
2013/11/06 职场文书
临床医学专业学生的自我评价分享
2013/11/21 职场文书
优秀班主任经验交流材料
2014/06/02 职场文书
公司总经理岗位职责范本
2014/08/15 职场文书
车间主任岗位职责
2015/02/03 职场文书
李清照的诗词赏析(20首)
2019/08/22 职场文书
导游词之千岛湖
2019/09/23 职场文书
oracle索引总结
2021/09/25 Oracle
解析探秘fescar分布式事务实现原理
2022/02/28 Java/Android
安装Ruby和 Rails的详细步骤
2022/04/19 Ruby