Question

不确定我在这里失踪了什么。

我需要将data的输出转换为this.contact。现在，我使用的是静态类变量，但是看起来很脏。

export class contactEdit {
  static t; // static class var
  constructor() {
    this.id = null;
    this.contact = null;
    contactEdit.t = this;
  }

  activate(id) {
    this.id = id;
    let contact = this.contact; // scoped version of class var
    return dpd.contacts.get(id).then(function(data) {
      console.log(data);
      contactEdit.t.contact = data; // this works
      contact = data; // this doesn't
    });
  }
}

通常情况下，我会在var contact功能中创建一个activate()（它可以在Chrome控制台中使用），但这似乎无法在ES6中运行。

Chrome控制台：

var c = null;
undefined
c;
null
dpd.contacts.get('a415fdc8f5a7184d').then(function(data) {
      c = data;
    });
Object {}fail: (n)then: (e,t)__proto__: Object
c;
Object {firstName: "John", lastName: "Doe", id: "a415fdc8f5a7184d"}

Answer 1

你需要做两件事。首先，使用箭头函数，然后使用`this.contact = data;

activate(id) {
  this.id = id;
  return dpd.contacts.get(id).then(data => {
    console.log(data);
    this.contact = data;
  });
}

你使用箭头函数，因为它处理JavaScript的“this”问题，其中这是指函数的词法范围，而不是你当前所在的对象。使用箭头函数确保箭头函数外的this与箭头函数内的this相同。

您需要使用this.contact，因为contact是该类的实例属性。

Answer 2

问题是contact = data;会更新本地contact变量的值，但不会更改this.contact的值。您需要更新contact联系人属性。问题是您无法访问函数核心内的this。

有不同的方法来解决这个问题。

1-您可以将激活的上下文（this）保存到activate闭包中的变量中，以便您可以在then的核心内访问它。

activate(id) {
    this.id = id;
    let that = this;
    return dpd.contacts.get(id).then(function(data) {
      console.log(data);
      that.contact = data;
    });
  }

2-您可以将该功能绑定到this，以便您可以访问它。

activate(id) {
    this.id = id;
    return dpd.contacts.get(id).then(function(data) {
      console.log(data);
      this.contact = data;
    }.bind(this));
  }

3-（推荐使用ES6）您可以使用箭头功能（箭头功能保留上下文）

activate(id) {
    this.id = id;
    return dpd.contacts.get(id).then((data) => {
      console.log(data);
      this.contact = data;
    });
  }

ES6和承诺内的变量范围

2 个答案: