uni-app开发踩坑之路之this指向问题

问题的发生

今天调试开发uniapp小程序时出现了一个问题，即 methods下的 pullDown 方法和 pullUp方法无法调用同为methods下的方法loadData， 编译至小程序的console控制台报错 TypeError:this.loadData is not a function ，输出结果如下:

报错截图

源代码是这样的:

布局代码

源代码

同为methods {}下的方法,使用this去调用竟然找不到方法？丈二和尚摸不着头脑，我也是一脸懵逼,完全搞不懂是为什么。
而且，在开发的时候， H5上是很正常的，可是运行到小程序上就出现这种问题。

接下来，我查找了几个uni-app的项目，发现他们项目也都可以通过this.function()的形式进行方法调用没有问题, 初步判断，排除自身的语法或写法问题。

由于我的代码在onLoad中也执行了this.loadData()方法，而在onLoad方法中调用成功，methods中却调用失败，提示方法不存在，那么问题可能就出现在了这个this的指向上。

onLoad(options) {
        this.loadData();
}

onLoad执行的方法可以正确加载数据

通过对this，this.loadData进行日志打印，发现this的实例中不存在当前methods下已定义的方法：

打印日志

打印结果

vue实例

问题的解决

既然知道在onLoad对象下this是对的，那就用一个全局变量在onLoad中初始化保存一下这个this，然后在pullUp方法中使用这个全局变量进行调用。

1. 在script开头, export default{} 代码块之前,初始化一个变量

//