Ich kann nicht auf Requisiten innerhalb der onToken-Funktion zugreifen

Question

Leute Ich benutze React-Stripe-Checkout, um die Kreditkarteninformationen meines Benutzers abzurufen. Nachdem ich die Daten des Benutzers gesammelt und an mein Backend gesendet habe, versuche ich eine Funktion von this.props aufzurufen, um den Status Client-Seite zu aktualisieren, aber 'dies' hat keine verfügbaren Requisiten/Status. Überprüfen Sie das Bild, um den Bereich von "this" in der onToken-Funktion zu sehen. Gibt es eine Möglichkeit, innerhalb von onToken entweder auf Requisiten oder Klassenfunktionen (z. B. onTokenThen) zuzugreifen?

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

Binden der onToken Funktion 'this' in den Konstruktor löste das Problem; Sowohl die Token- als auch die Requisiten-/Klassenfunktionen sind jetzt verfügbar.

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