Question

我有一个React组件，通过它我需要在成功的数据库调用后更改状态。数据库调用使用了一个回调函数，该函数不能更改，但是我找不到从该回调函数内部访问同一组件中的重定向函数的方法。我刚收到错误enableRedirect' of null

我尝试将回调函数更改为箭头函数，但随后未正确调用它。我一直在阅读类似问题的其他答案，但不能使其适用于我的情况

    ...
    componentDidUpdate = (prevProps, prevState) => {
    if (prevState.braintreeToken !== this.state.braintreeToken) {

      dropin.create(
        {
          authorization: this.state.braintreeToken,
          container: "#dropin-container",
        },
//callback function happens here
        (createErr, instance) => {
          button.addEventListener("click", function() {
            instance.requestPaymentMethod(function(
              requestPaymentMethodErr,
              payload
            ) {
              api
                .submitPayload(payload, plan, id)
                .then(res => {
                  //this is where I'm trying to call my enable redirect function
                  this.enableRedirect();
                })
                .catch(err => {
                  //error handling
                });
            });
          });
        }
      );
    }
  };

    // the function I'm trying to call
    enableRedirect = () => {
      this.setState({
        redirect: true
      });
    };
 ...

我需要在回调函数中调用enableRedirect函数！

Answer 1

代替这个

button.addEventListener("click", function() {

});

使用

button.addEventListener("click", () => {

});

对于箭头功能和普通功能，此值不相同。对于正常功能，此是您单击的按钮。

请参阅此link。

无法在React回调中访问'this'函数

1 个答案: