Vue笔记：使用 axios 中 this 指向问题

问题背景

在vue中使用axios做网络请求的时候，会遇到this不指向vue，而为undefined。

如下图所示，我们有一个 login 方法，希望在登录成功之后路由到主页，但通过 this.$router 获取路由器出错。

解决方案

使用箭头函数替代普通函数，ES6中的箭头函数 “=>” 内部的 this 属于词法作用域，由上下文确定（也就是由外层调用者vue来确定）。

改成如下图所示，我们看到 this.router 已经正确的返回了路由器对象。

so, 遇到类似问题的朋友们，箭头函数用起来。

转载于:https://www.cnblogs.com/xifengxiaoma/p/9535700.html

Vue笔记：使用 axios 中 this 指向问题相关推荐

axios的this指向_vue使用axios中 this 指向问题
1.解决办法在vue中使用axios做网络请求的时候,会遇到this不指向vue,而为undefined,可以使用箭头函数"=>"来解决.如下:methods: { ...
前端自学Vue笔记干货（第一版，持续更新中~~~）
学习笔记 Vue笔记 nprogress使用 npm i nprogress -S 基本上都是在对axios进行二次封装.前置守卫路由或者封装成工具函数的.js文件中用到 import nprogre ...
VUE 笔记（持续更新中...）
最近刚好我也在学习vue,这些是我的一些笔记,记录下来,方便用的时候查看,欢迎大家批评指正! 1. 简介 Vue.js是JavaScript MVVM(Model-View-ViewModel)框架 ...
Vue 学习笔记（1） Vue 基础语法 + Axios 基本使用
Vue Vue 简介下载 Vue {{}}:插值表达式 v-text:显示文本 v-html:显示解析html标签的文本 v-on:事件绑定 v-show:控制页面元素隐藏与显示(display控制 ...
Vue学习笔记：axios 拦截器的用法
Vue学习笔记:axios 拦截器的用法什么是axios 拦截器? 拦截器就是拦截每一次的请求和响应,然后进行相应的处理.请求拦截器,它可以统一在你发送请求前在请求体里加上token:响应拦截器,是 ...
axios vue 回调函数_Vue 02 —— Vue 入门小案例~使用 Axios 中的GET、POST请求
作为后端攻城狮,写前端代码是一种什么体验? 相信不少人和 @Python大星一样,有写过前端代码的经历. 记录一下,Vue 框架开发中"啼笑皆非"的故事,非专业前端人员,该案例无 ...
Vue笔记——Vue组件中引入jQuery
Vue笔记--Vue组件中引入jQuery 如果想在普通的HTML页面引入jQuer库的话,直接使用<script src="jQuery.js"></scrip ...
vue文件里在style的样式需要什么loader_Vue学习笔记之Webpack中css、less、图片等文件处理...
一.webpack中使用css文件: loader是webpack中一个非常核心的概念,去转化webpack不能转化或打包的文件. 安装loader: 官网介绍: 安装: cnpm install - ...
Vue（五）Vue中的网络请求（使用Vue脚手架发送Axios请求）
一.Axios 1.定义:利用ES6提供的Promise方式,把AJAX进行了封装.我们在Vue中发送网络请求,基本上就是使用Axios 需要安装第三方的Axios模块,才能使用 ...
Vue学习笔记（更新中）
MVVM模型: 1. M:模型(Model):data中的数据 [数据层,数据可能是我们固定的死数据(写在script里的自定义对象等),更多的是来自我们服务器,从网络上请求下来的数据] 2. V:视 ...

Vue笔记：使用 axios 中 this 指向问题

问题背景

解决方案

Vue笔记：使用 axios 中 this 指向问题相关推荐

最新文章

热门文章