Как отказаться от Observer Polymer

Question

Я пытаюсь бежать getResponse один раз, когда веб-компоненты заканчивают загрузку. Тем не менее, когда я пытаюсь запустить это, debounce функция просто действует как асинхронная задержка и запускается 4 раза после 5000 мс.

static get properties() {
  return {
    procedure: {
      type: String,
      observer: 'debounce'
    }
  }
}

debounce() {
  this._debouncer = Polymer.Debouncer.debounce(this._debouncer, Polymer.Async.timeOut.after(5000), () => {
    this.getResponse();
  });
}

getResponse() {
  console.log('get resp');
}

Что нужно получить getResponse запустить один раз при загрузке элемента?

Answer 1

Вы уверены, что хотите использовать для этого debouncer? Вы можете просто использовать connectedCallBack, чтобы получить одно событие времени

class DemoElement extends HTMLElement {
  constructor() {
    super();
    this.callStack = 'constructor->';
  }
  
  connectedCallback() {
    this.callStack += 'connectedCallback';
    console.log('rendered');
    fetch(this.fakeAjax()).then((response) => {
      // can't do real ajax request here so we fake it... normally you would do 
      // something like this.innerHTML = response.text();
      // not that "rendered" get console logged before "fetch done"
      this.innerHTML = `
        <p>${this.callStack}</p>
        <p>${response.statusText}</p>
      `;
      console.log('fetch done');
    }).catch(function(err) {
      console.log(err); // Error :(
    });
  }
  
  fakeAjax() {
    return window.URL.createObjectURL(new Blob(['empty']));
  };
}
customElements.define('demo-element', DemoElement);

<demo-element></demo-element>

Если вам действительно нужно использовать наблюдателя, вы также можете установить флаг this.isLoaded в вашем connectedCallback() и проверьте это в своем коде наблюдателя.