无法正确访问 Vue 实例的属性

我来变强了2025-12-11 9:49

修改前代码（错误部分）

javascript 复制代码

uni.getLocation({
  type: 'gcj02',
  success: function(res) {
    const latitude = res.latitude;
    const longitude = res.longitude;
    const location = [];
    location.push(latitude);
    location.push(longitude);
    this.locationData = location; // 这里的this指向错误
    console.log(this.locationData);
    // ...
  },
  fail: function(err) {
    // ...
  }
});

原因分析

在 findLocation 方法中， uni.getLocation 的 success 回调使用了普通 function ，导致 this 指向错误，无法正确访问 Vue 实例的 locationData 属性。

修改后代码（正确部分）

javascript 复制代码

uni.getLocation({
  type: 'gcj02',
  success: (res) => {
    const latitude = res.latitude;
    const longitude = res.longitude;
    const location = [];
    location.push(latitude);
    location.push(longitude);
    this.locationData = location; // 这里的this正确指向Vue实例
    console.log(this.locationData);
    // ...
  },
  fail: (err) => {
    // ...
  }
});

本bug是典型的JavaScript中 this 指向问题，通过使用箭头函数可以确保回调函数中的 this 正确指向Vue实例。