vue的methods属性的方法中出现回调函数，在回调函数内部获取data中的数据

在vue中，可能会遇到在methods属性中书写的方法中出现回调函数的情况，如以下代码：

data(){return{gemometry: ""}
}
methods: {draw(){map.changeDragMode('drawPolygon', function(e){this.geometry = e.getCoord()})}
}

该代码主要想把函数参数中的坐标值绑定到data数据中，但是这里是不可行的，因为此时的函数内部绑定的this是该函数下的this，而不是vue中的this值，如果想完成绑定，主要有两种方法解决。

第一种是将this保存后再使用，实现的代码如下：

draw(){let _this = thismap.changeDragMode('drawPolygon', function(e){_this.geometry = e.getCoord()})
}

第二种是将function转换为箭头函数，箭头函数内部的this总是指向词法作用域，是外层调用者，在这里是依旧指向的是vue对象，实现的代码如下：

draw(){map.changeDragMode('drawPolygon', e => {this.geometry = e.getCoord()})
}

vue的methods属性的方法中出现回调函数，在回调函数内部获取data中的数据相关推荐

Vue2.x源码学习笔记-Vue实例的属性和方法整理
还是先从浏览器直观的感受下实例属性和方法. 实例属性: 对应解释如下: vm._uid // 自增的id vm._isVue // 标示是vue对象,避免被observe vm._renderProx ...
vue系列：vue的常用属性和方法
vue系列:vue的常用属性vm.$ el.vm.$ data.vm.$ options.vm.$ refs和方法vm.$ mount().vm.$ nextTick().vm.$ set().vm. ...
vue实例的属性和方法
一. vue实例的属性和方法 1.属性 1.常用属性 vm.$el #获取的是个dom对象可以点下面的属性 vm.$data #获取的是个.... vm.$options vm.$refs ...
在vue中，Echarts雷达图中indicator的点击事件，不能改变data中的值的解决方法
在vue中,Echarts雷达图中indicator的点击事件,不能改变data中的值的解决方法参考文章: (1)在vue中,Echarts雷达图中indicator的点击事件,不能改变data中的 ...
filters获取data中的数据
第一种方式:申明全局变量,改变this方法. 在对应的组件中申明全局变量在beforeCreated申明周期中修改this的指向,并在filters中使用.就可以获取data中申明的options数 ...
vue的methods属性
在开发中,我们经常需要用到函数, 通过将一些需要复用的逻辑封装在函数里,多次调用这个函数来达到逻辑代码复用的目的. 在vue中,函数被定义成为方法来使用,这些方法定义在methods属性中,然后就可以 ...
Vue 在beaforeCreate时获取data中的数据
众所周知,vue在beforecreate时期是获取不到data中的数据的但是通过一些方法可以实现在beforecreate时获取到data中的数据暂时想到两种放发可以实现,vue在before ...
【Android 内存优化】Android 工程中使用 libjpeg-turbo 压缩图片 ( JNI 传递 Bitmap | 获取位图信息 | 获取图像数据 | 图像数据过滤 | 释放资源 )
文章目录一.Bitmap 图像数据处理二.Java 层 Bitmap 对象转为 JNI 层 bitmap 对象三.获取 bitmap 中的图像数据四.过滤 bitmap 中的图像数据 ( 获取 ...
python中读取指定的行和列_Python怎么获取excle中指定行和列的值？
''' https://www.cnblogs.com/xiazhenyu/ *** 学而思之.思而记之.记而习之 *** ''' f="dict_file.txt" #定义文件名 ...

vue的methods属性的方法中出现回调函数，在回调函数内部获取data中的数据

vue的methods属性的方法中出现回调函数，在回调函数内部获取data中的数据相关推荐

最新文章

热门文章