Vue中上传文件，使用fr.onload = function(){} vue无法进行数据绑定

Vue中上传文件，使用fr.onload = function(){} vue无法进行数据绑定

 

核心代码如下：

fr.onload = function () {
    this.imageUrl = fr.result;
    // console.log(this.imageUrl);
};

在执行完这个函数后，在外部打印this.imageUrl，发现无法获得预期的结果

仔细分析可知，这里的this，指向的是这个function()函数，不是全局的！

因此我们应该用箭头函数，修改代码如下：

fr.onload = () => {
     this.imageUrl = fr.result;
    // console.log(this.imageUrl);
 };