Zugriff auf Eigenschaften in Callback-Funktion nicht möglich React

Question

Ich verwende eine Bibliothek mit dem Namen Papa Parse zum Parsen einer CSV-Datei nach JSON. Der Parser funktioniert einwandfrei, aber ich kann meinen Aktionsersteller nicht in der Callback-Funktion aufrufen, die im Abschnitt 'complete' des config-Objekts für die Analyse von Papa angegeben ist. Ich glaube, das ist ein Problem, aber ich konnte es nicht lösen. Der Hauptteil des Interesses unten ist, warum ich keine der Funktionen in der 'printFile'-Funktion aufrufen kann, am wichtigsten die' addRoster'-Funktion. Bitte lassen Sie mich wissen, dass Sie irgendwelche Vorschläge oder Ideen haben. Vielen Dank!

Bearbeiten: Ignorieren Sie, dass dies in Schnipselform ist. Was hier läuft, ist nicht lauffähig, ich konnte einfach keine Formatierung zum Laufen bringen.

class Roster extends Component { 

    super(props) { 

    this.printFile = this.printFile.bind(this); 

    this.testMethod = this.testMethod.bind(this); 
    } 

    componentWillMount() { 
    this.props.addRoster('test') 
    } 

    printFile(results, file) { 
    this.props.addRoster(file); 
    this.props.testMethod; 
    } 

    testMethod(test) { 
    console.log("Winner") 
    } 

    fileDrop(file) { 

    var config = { 
     delimiter: "", // auto-detect 
     newline: "", // auto-detect 
     quoteChar: '"', 
     header: true, 
     dynamicTyping: false, 
     preview: 0, 
     encoding: "", 
     worker: false, 
     comments: false, 
     step: undefined, 
     complete: this.printFile, 
     error: undefined, 
     download: false, 
     skipEmptyLines: false, 
     chunk: undefined, 
     fastMode: undefined, 
     beforeFirstChunk: undefined, 
     withCredentials: undefined 
    } 
    Papa.parse(file, config) 
    } 


    render() { 
    const { 
     addRoster 
    } = this.props; 

    return (< 
     Grid > 
     < 
     Row > 
     < 
     MyDropzone onFileDrop = { 
     this.fileDrop.bind(this) 
     } 
     /> </
     Row > < 
     /Grid> 
    ) 
    } 

} 

export default connect(null, { 
    addRoster 
})(Roster); 

Answer 1

Ich denke, Sie haben keinen Konstruktor hinzugefügt, so dass die Funktion nicht gebunden wurde? Versuchen Sie, diese

super(props) 
{ 
    this.printFile = this.printFile.bind(this); 
    this.testMethod = this.testMethod.bind(this); 
} 

zu

constructor(props) 
{ 
    super(props); 
    this.printFile = this.printFile.bind(this); 
    this.testMethod = this.testMethod.bind(this); 
}