react中使用AlipayJSBridge 支付宝支付调用接口在H5网页的应用

支付宝文档：
https://opendocs.alipay.com/open/
我用的是第二种，如下：

AlipayJSBridge在支付宝里才能唤起
主要流程：我们做的是支付宝连续包月自动续费，因为支付宝限制原因需要签约两次付费，在客户端显示二维码，客户保存二维码到支付宝扫码进行后续操作
前端提供给后端的主要调起流程如下：
直接在componentDidMount 里调起，render里可以加一些loading效果，看个人需要

componentDidMount = () => {
      let that = this
     // activeMobx.isAlipayAndAgreementPageSign()调起接口，拿到后端返回的数据，这是后端给的接口
      activeMobx.isAlipayAndAgreementPageSign().then(res=>{
        let str = res.data.sign
        this.ready(
          ()=>{
              AlipayJSBridge.call("tradePay", {
                orderStr: str
              }, function(data) {
                  if("9000" == data.resultCode){
                    console.log('成功')//文档里会有其它resultCode，记得是string类型"9000"
                    }     
              });
            });
      })  
    }

    ready(callback) {
      // 如果jsbridge已经注入则直接调用
      if (window.AlipayJSBridge) {
        callback && callback();
      } else {
        // 如果没有注入则监听注入的事件
        document.addEventListener('AlipayJSBridgeReady', callback, false);
      }
    }