在vue较多使用的是axios请求,请求后的回调函数中,this不能指向当前vue实例,打印出来是undefined;

1,let that = this,以前常用的存储this的方法

getSerTime:function(){
    let that = this ;//存储this
    Vue.axios.get(root + '/api/findInfoDetail').then((response) => {
        console.log(response.data);
        console.log(this);
        console.log(that);

2.使用箭头函数

Vue.axios.get(root +'/api/findInfoDetail',{params:{notid:this.searchData.notId,type:this.searchData.type}}).then((response) => {
    console.log(response.data);
    console.log(this);
    //箭头函数内部的this是词法作用域,是由外层调用者vue来确定,使用箭头函数之后,箭头函数指向的函数内部的this已经绑定了外部的vue实例了
                      在vue较多使用的是axios请求,请求后的回调函数中,this不能指向当前vue实例,打印出来是undefined;1,let that = this,以前常用的存储this的方法getSerTime:function(){    let that = this ;//存储this    Vue.axios.get(root + '/api/findInfoDetail'...
				
vueaxios直接在html文件使用的时候,位于axios的请求的this指向并不是指向vue,而是指向window,如果在请求直接用this获取data的数据会出现undefined的问题,解决思路是将ES5的函数语法更换为箭头函数即可解决此问题,深层的原因就得深入去了解箭头函数和普通函数之间的区别了! new Vue({ el: '#app', data:{ carousels: [], created() { axios.get('/a
Vue——axiosthis的指向问题 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 。在进行Vue实验时,需要用到axios进行接口请求,并将返回的内容传递到Vue的data选项。正常情况下,会使用this.list = response.data的格式进行赋值,但this的指向恰恰是最容易被忽略的地方。 出现的问题: 在vue使用axios做网络请求的时候,会遇到this不指向vue,而指向其它地方的情况。如下图所示: 通过在网络上搜索,有很
vue通过this.refs操作DOM时的注意事项 在axios请求完成时获取获取绑定的ref 为undefined vuethis.$nextTick()函数的使用 Vue 的 nextTick 涉及到 Vue DOM 的异步更新 Vue 实现响应式并不是数据发生变化之后 DOM 立即变化,而是按一定的策略进行 DOM 的更新 $nextTick 是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据之后使用 $nextTick,则可以在回调获取更新后的DOM axios({
这篇转载的博客从this is undefined问题入手,详细介绍了问题缘由和各种函数的区别以及使用场景,尤其对于本人在开发vue初踩坑的时候,在axios的正确使用问题上醍醐灌顶。因此转载并且重新排版了一下,原文地址:http://www.javanx.cn/20200814/this-is-undefined/ 当我们使用 Vue 在愉快的开发项目的时候,突然报了一个错误: this is undefined 别担心,不只有你一个人,我也经常遇到这个问题很多次,接下我们一起来看看如何解决这个问题.
Vueaxios箭头函数的this和function(r)的this的区别 在methods下的函数this指向的是当前创建的vue实例,而在这些函数内部使用例如axios与后台交互后回调函数的内部的this并非指向当前的vue实例,若想拿到后台回传的数据更新data里的数据,不能在回调函数直接使用this,要用外部函数定义的变量存储的this,也就是当前vue的实例。 使用箭头函数之后,箭头函数指向的函数内部的this已经绑定了外部的vue实例了,是不是很方便呢?