手机上没有显示贝宝订阅按钮

Question

我在应用程序的 4 个不同位置使用 Paypal 3 次订阅和一次付款。

在台式机上一切正常，但订阅按钮在手机上不显示。

我觉得问题出在导入库上，这个导入有什么问题吗？

没有任何类型的错误，我检查并发现 phone 上加载了 PayPal，但没有显示按钮。


 <script
src=`https://www.paypal.com/sdk/js?clientid=${process.env.PAYPAL_CLIENT_ID}
&currency=GBP&disable-funding=credit,card&vault=true&intent=subscription`
></script>

Answer 1

所以问题是按钮被删除了，因为 paypalButton.close() 在状态渲染时被调用（不知道为什么）。

请参阅此问题以获取有关该问题的更多信息：

https://github.com/paypal/paypal-checkout-components/issues/1506

通过在渲染前休眠1秒解决，我不知道为什么，但这已经解决了问题。

所以我的代码是：

睡眠功能：

 function sleep(ms) {
     return new Promise((resolve) => setTimeout(resolve, ms));
  }

支付宝；按钮组件：

 const paypalRef = useRef();
 
// options
 const btnOptions = {
    createSubscription: function (data, actions) {
      return actions.subscription.create({
        plan_id: planID,
      });
    },
    onApprove: function (data, actions) {
      alert(data.subscriptionID);
    },
  };

 // effect, make sure to listen to Paypal library load
  useEffect(() => {
    (async () => {
        await sleep(1000)  // sleep second before rendering. <---------------------- solution here;
      if (paypalRef.current) {
        btn = window.paypal.Buttons(btnOptions);
        btn.render(paypalRef.current);
      }
    })();
  }, [window.paypal]);


  return <div className={styles.paypal_btn} ref={paypalRef}></div>;

手机上没有显示贝宝订阅按钮

paypal subscription buttons are not showing on phones

javascript

google-chrome

paypal

sdk

cross-browser