vue 使用axios请求成功的this问题

liyuzhao7年前开发项目遇到的问题1686

一个简单的例子:

image.png

//上面的this.$http.get是中的this是vue的实例。axios的文档中,get请求是如上面所写的,上面代码的意思是请求登录返回数据。一般做的逻辑处理是请求成功后要跳转,

//所以我们要用到vue的路由做跳转,跳转为this.$router.push('/user') 就是我要跳转到from这个组件中

所以应该会在then这个函数里面写this.$router.push('/user') 代码如下:

image.png

很明显出错了,这个then函数里面的this已经不是vue的实例了,而是一个undefined,所以查找资料看到了解决方法:

第一种:在请求前定义一个局部变量来存储这个this vue的实例,然后在then里面使用,代码如下:

image.png

这样既可解决.

第二种:把function(response) 改为response => 这个写法我没有查相关的资料,有兴趣的同学可以去查看一下。代码如下:

image.png


如果有错欢迎提出。最近翻文档才知道,使用箭头函数,里面的this是上一层的,所以第二种解决方法应该是这样理解的。


相关文章

php+redis高并发秒杀方案(个人见解)

需求:1:一个商品,库存只有100。2:网站很出名,估计并发量为50W。3:实现秒杀。 分析:1:库存只有100,只能操作更新db库存 100次2:访问量大,采用redis来做并发处理3:设...

vue的axios的post跨域问题!

最近在学vue,用axios的post跨域请求api的时候出现了问题。后面查资料,发现是跨域请求是有区别的。一种是简单的跨域请求:get另一种是非简单的跨域请求:post put 等等 。请看http...

iview使用v-for循环数据的更新问题。

iview使用v-for循环数据的更新问题。

最近在接数据中,遇到了一个v-for循环数组获取数据,但是这个数组可能会被操作,所以这个数组要实时更新。用了vue的双向绑定,但是不好用,经过查资料,发现:由于 JavaScript 的限制, Vue...

在 hyperf 中使用 MongoDB

欢迎使用 phper666/mongo-db,地址:https://github.com/phper666/mongo-db1、默认使用mongodb提供的库来封装,官方git地址:https://g...

一台云服务器配置两个网站

一台云服务器配置两个网站

一台云服务器配置两个网站最近一直在烦恼,一台云服务器怎么配置两个网站呢?我在本地的win10环境下配置apache的两个虚拟主机和两个ip可以成功的用不同的地址访问到不同的www下的目录。操作如图:1...

hyperf 启动、重启、停止、文件变化监听命令包

鉴于hyperf1.1+还没有重启等命令,本地调试比较麻烦,所以使用了FanchangWang写的代码封装成了一个包,方便使用。该扩展包完全使用了FanchangWang写的代码,非常感谢Fancha...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。