无法访问onToken函数中的道具

Question

我正在使用react-stripe-checkout来收集用户的信用卡信息。在收集用户的详细信息并将它们发送到我的后端之后，我正在尝试从this.props调用一个函数来更新状态客户端，但是“this”没有可用的props / state。检查图像以查看onToken函数中“this”的范围。有没有办法在onToken中访问道具或类函数（例如onTokenThen）？

import React, { Component } from 'react';
import StripeCheckout from 'react-stripe-checkout';
import { Button } from 'react-bootstrap';
import Axios from 'axios';

export default class AddCustomer extends Component {
  constructor (props, context){
    super(props, context);
    this.onTokenThen = this.onTokenThen.bind(this);
  };

  onToken(token) {
    console.log('token', token);
    debugger; // <-- 'this' 
    Axios({
      method: 'post',
      url: '/api/v1/addCustomer',
      data: {
        stripeToken: token
      }
    })
    .then(this.props.addCustomerState) // <-- can't access props here
    .catch(function (response) {
      console.log(response);
    });
  }

  onTokenThen(customer){
    debugger;
  }

  render() {
    let currentUser = this.props.activeUser.email;
    return (
        <StripeCheckout
          ...
          token={this.onToken}
          ...
          <Button bsStyle="success">
            Add customer
          </Button>
        </StripeCheckout>
    );
  }
};

Answer 1

在构造函数中将onToken函数绑定到'this'解决了问题;现在可以使用令牌和道具/类功能。

  constructor (props, context){
    super(props, context);
    this.onToken = this.onToken.bind(this); // <-- makes available 'this' in onToken scope
  };