如何仅在状态更改后解决 Promise

How to resolve a Promise only after a state change

我试图仅在承诺之外满足特定条件后才解决承诺:

class myClass extends ... {

    render() {
       ...
       this.fetch();
       ....
    }

    fetch(){
        Promise.all([
          ....,
          ....,
          ....
        ]).then( () => {
          // new Promise or somthing like that
          // wait for state changed to resolve it
        }
        ).then(
          // do something
        )
    }

    stateChanged(state){
        if(condition){
           // resolve promise from here
        }
    }

}

我试着用与这个问题类似的方式来实现它 Resolve Javascript Promise outside function scope 但我不明白

  1. 我们如何调用变量
  2. 如何在我的 Class 中进行这项工作 我用 this.waitForPromise = null 变量尝试过,但是当我打电话 稍后 this.waitForPromise() 我得到 a is not a function 类型错误。
class myClass extends ... {

    render() {
       ...
       this.fetch();
       ....
    }

    constructor(){
        this._waitForPromise = null;
    }

    fetch(){
        Promise.all([
          ....,
          ....,
          ....
        ]).then( () => {
            new Promise(function(resolve, reject) { 
              this._waitForPromise = resolve; 
            });
        }
        ).then(
          // do something
        )
    }

    stateChanged(state){
        if(condition){
           this._waitForPromise();
        }
    }

}

非常感谢任何帮助和解释。

您在使用 this 时遇到关闭问题,因此请先捕获它。

你应该return你then中的承诺。

您应该检查状态更改时是否创建了 promise。

请记住,您只能调用其中一个 resolve/reject,而且只能调用一次。

class myClass extends ... {

    render() {
       ...
       this.fetch();
       ....
    }

    constructor(){
        this.resolve = null;
        this.state = null; // TODO initial state
    }

    fetch(){
        const that = this;
        Promise.all([
          ....,
          ....,
          ....
        ]).then( () => {
            return new Promise(function(resolve, reject) { 
              that.resolve = resolve;
              that.checkState();
            });
        }
        ).then(
          // do something
        )
    }

    checkState(){
      if(condition && this.resolve){
         this.resolve();
         this.resolve = null;  // set to null to ensure we don't call it again.
      }
    }

    stateChanged(state){
        this.state = state;
        this.checkState();
    }

}

好的,所以我对 Polymer 3 不是很熟悉,但我对 Polymer 1 和 2 很流利。

我知道你想这样做:

  1. 得到一个ajax承诺。

  2. Return 说 ajax 一旦某个状态发生变化就承诺。

  3. 如果上述承诺尚未完成,则执行获取调用。

您需要做的是将您的承诺保存为一个变量,然后将它与其他方法调用链接在一起。下面的评论详细解释了我正在使用 OP 中的示例代码做什么。

class myClass extends ... {

render() {
   ...
   this.fetch();
   ....
}

fetch(){
    this.set('savedPromise', Promise.all([ // save promise to variable 
      ....,
      ....,
      ....
    ])
    // not needed
    /* .then( () => {
      // new Promise or somthing like that
      // wait for state changed to resolve it
    }*/
    ).then(
      // do something

      return result // added this line
    )
}

stateChanged(state){
    if(condition){
       if (this.savedPromise) {
         this.savedPromise.then(function(response) {
           // handle data
         });
       else {
         fetch().then(function(response) {  // if set before render(), do a fetch call.
           // handle data
         }
       }
    }
}

}