Reduktive Aktion "ist keine Funktion" beim Versand von Komponente

Question

Ich versuche, eine App mit einem CSV-Upload zu erstellen. Wenn eine CSV hochgeladen wird, ändert sich der Status und dann werde ich von CSV zu JSON analysieren und damit arbeiten. Die Idee besteht darin, eine Datei hochzuladen und den Status zu aktualisieren. Sobald dieser Zustand aktualisiert wurde, würde ich die CSV an eine Meteor.Methode übergeben, um sie nach JSON zu analysieren. Ich benutze Meteor, React und Redux. Ich habe eine Komponente, die den Upload übernimmt, eine Aktion und einen Reducer. Alle Dateien sind unten - ich bin neu bei Meteor, React und Redux und ich kann nicht für das Leben von mir herausfinden, warum das nicht funktioniert. Ich glaube nicht, dass ich vollständig verstehe, was ich zu erreichen versuche. Irgendwelche Vorschläge sind willkommen.

ERROR - Uncaught TypeError: fileUpload is not a function UploadCSV.jsx

// ACTIONS - fileUpload.js 
export default function fileUpload(file) { 
    return { 
    type: 'FILE_UPLOAD', 
    file 
    }; 
} 



//REDUCERS - upLoad.js 
export default function upLoad(state = 'NO_FILE', action = {}) { 
    switch (action.type) { 
    case 'FILE_UPLOAD': 
     return action.file; 
    default: 
     return state; 
    } 
} 



//COMPONENTS - UploadCSV.jsx 
import React, { Component, PropTypes } from 'react'; 
import { connect } from 'react-redux'; 
import Dropzone from 'react-dropzone'; 
import { RaisedButton } from 'material-ui'; 
import { Colors } from 'material-ui'; 
import fileUpload from '../actions/fileUpload.js'; 
import { uploadCSV } from '../actions/uploadCSV.js'; 

class UploadCSV extends Component { 
    render(dispatch, file, fileUpload) { 
    const onDrop = (file) => { 
     console.log(file); 
    } 
    const upLoad =() => { 
     this.props.dispatch(fileUpload(file)); 
    }; 
    return (
     <div> 
     <Dropzone accept="csv" 
        onDrop={() => { 
         return upLoad(); 
        }}> 
      <div>Click or drop files here.</div> 
     </Dropzone> 
     </div> 
    ) 
    } 
} 

export default connect()(UploadCSV); 

Ich verstehe nicht, warum Fileupload ist „keine Funktion“, wenn es eine Aktion und es importiert wird.? Wenn jemand eine Hand leihen kann, würde ich es begrüßen.

Danke!

Answer 1

Weil Sie in Ihrer Rendermethode ein Argument namens fileUpload definiert haben. Entfernen Sie alle Argumente, die Sie in Ihrer Rendermethode definiert haben. Die Klasse hat einen Abschlussbereich für alle importierten Module, sodass Sie sie überall in der Klasse referenzieren können.

Answer 2

Es scheint, dass importierte Elemente die Groß-/Kleinschreibung nicht beachten, wenn sie importiert werden. Das ist es, was für mich das gleiche Problem verursacht, also nur ein Kopf hoch.

Answer 3

Neustart der Anwendung

Ich hatte das gleiche Problem, nur weil ich meine Anwendung neu starten vergessen. Alle Redux-Aktionen werden im ersten Zustand eingerichtet, sodass der Redux Store keine Ahnung hatte, dass ich eine neue Funktion implementiert habe.

Ich hoffe, das hilft jemandem.