Uncaught Reference: ReservationCard ist nicht definiert

Question

I ‚connect‘ zu verwenden, ich versuche zu bekommen Wert von Vorlage Minderer

Ich bin vor dem Fehler unten:

Uncaught ReferenceError: ReservationCard is not defined

Hier ist der gesamte Code, in einem jsfiddle.

den Snippet Code Providing unter:

export default React.createClass({ 
    propTypes: { 
     value: React.PropTypes.object.isRequired, 
     profile: React.PropTypes.object.isRequired, 
     SPORTSDetails: React.PropTypes.shape({ 
      error: React.PropTypes.object, 
      SPORTSId: React.PropTypes.number, 
      SPORTSName: React.PropTypes.string, 
      SPORTSAmount: React.PropTypes.number, 
      SPORTSDate: React.PropTypes.string, 
      isRetrieving: React.PropTypes.boolean 
     }), 
     onEdit: React.PropTypes.func.isRequired 
    }, 

    displayName: 'ReservationCard', 
}) 

export default connect(state => ({ 
    profile: state.template.profile, 
}), null, null, { 
    withRef: true // allows parent to access component functions 
})(ReservationCard); 

Answer 1

Export Standard funktioniert nur mit einer Eigenschaft. (Sie können einen Hauptwert aus einer Datei exportieren. Alles andere muss benannt werden)

Sie müssen Ihre Komponente definiert und dann verwendet haben. Die Art, wie Sie es jetzt tun displayName ist noch nicht mit einer Komponente verbunden. Der exportierte ist.

So kann man es an einer Stelle definieren und verwenden Sie es mit der Funktion connect

let ReservationCard = React.createClass({ 
    propTypes: { 
     value: React.PropTypes.object.isRequired, 
     profile: React.PropTypes.object.isRequired, 
     SPORTSDetails: React.PropTypes.shape({ 
      error: React.PropTypes.object, 
      SPORTSId: React.PropTypes.number, 
      SPORTSName: React.PropTypes.string, 
      SPORTSAmount: React.PropTypes.number, 
      SPORTSDate: React.PropTypes.string, 
      isRetrieving: React.PropTypes.boolean 
     }), 
     onEdit: React.PropTypes.func.isRequired 
    }, 

    displayName: 'ReservationCard', 
    }) 

    export default connect(state => ({ 
     profile: state.template.profile, 

    }), null, null, { 
     withRef: true // allows parent to access component functions 
    })(ReservationCard);