如何知道 PayPal 智能支付按钮是否已完成渲染

Question

我正在尝试将 PayPal Smart Payment 按钮添加到我的网站。用于呈现按钮的 HTML 容器是通过 AJAX 请求使用 AJAX 请求paypal.Buttons.render()调用的方法接收的onsuccess。现在一切正常，除了按钮需要一些时间在网站上呈现并变为活动状态。我想提示我的用户按钮正在呈现或加载，所以当 AJAX 请求返回并且没有显示按钮时，他们不会留在黑暗中。有没有办法知道按钮何时完全呈现？

$.ajax({
  url: example/foler,
  data: data,
  success: success(data)
});

function success(data) {
  // data = <div id='paypal-button-container'></div>
  paypal.Buttons().render('#paypal-button-container');

  // Display "Button Loading..."
  // Find out if button has completely rendered, then turn off "button loading..."
}

Answer 1

You can use .then(callback) since the render() returns a Promise.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises

A Promise is an object representing the eventual completion or failure of an asynchronous operation. Since most people are consumers of already-created promises, this guide will explain consumption of returned promises before explaining how to create them.

Essentially, a promise is a returned object to which you attach callbacks, instead of passing callbacks into a function.

$.ajax({
  url: example/foler,
  data: data,
  success: success(data)
});

function success(data) {
  // data = <div id='paypal-button-container'></div>
  // Display "Button Loading..."
  paypal.Buttons().render('#paypal-button-container').then(function() { 
    // Button has completely rendered, then turn off "button loading..."
  });

}