2016-08-08 18 views
0

Vom docs, bekomme ich, dass ich einen reaktiven Datencontainer um meine Komponente verwenden müssen, die aktuell angemeldeten Benutzers abzurufen (falls vorhanden), aber wie bekomme ich die Daten aus dem Container ?Holen Sie Daten von einem reaktiven Behälter

import { Meteor } from 'meteor/meteor'; 
import React, { Component } from 'react'; 
import { createContainer } from 'meteor/react-meteor-data'; 

export default FooContainer = createContainer(() => { 
    return { 
    user: Meteor.user() 
    }; 
}, class FooComponent extends Component { 

    render() { 
    return (<div>{ /* this.data.user ??? */ }</div>); 
    } 
}); 

Wie erhalte ich die von der Container-Funktion in meiner render Methode zurückgegebenen Daten?

+2

Haben Sie 'this.props.user' probiert? – Gemmi

+0

Ich habe * gerade * festgestellt, dass wenn 'console.log (this);' :) –

Antwort

1

Ich sehe Sie einen user Schlüssel in Ihrem Container zurückgegeben, daher werden Ihre Daten über Ihre this.props.user Prop in Ihrer Komponente zugänglich sein.

So stellen Sie sicher, dass Sie etwas zu Ihrem Container hinzu:

export default FooContainer = createContainer(() => { 
const subscription = Meteor.subscribe("userData"); 
subscription.ready() ? Session.set("dataReady", true) : Session.set("dataReady", false); 

    return { 
    user: Meteor.user() 
    }; 
} 

und in der Render-Methode:

render() { 
    if(Session.get("dataReady")){ 
return (<div>{ /* this.data.user ??? */ }</div>); 
} 
    } 

Vertrauen Sie mir, es wird Ihnen eine Menge Kopfschmerzen sparen und eine Menge von Fehlern in der Zukunft. Dadurch wird sichergestellt, dass Ihre Daten zu 100% bereit sind, bevor sie in Ihrer Komponente aufgerufen und gerendert werden.

Oh, auch vorausgesetzt, Sie autopublish entfernt haben, veröffentlichen die Daten des bestimmten Benutzers, um es zu zeichnen, wie ich oben zeigte:

Meteor.publish("userData", function(){ 
    return Meteor.users.find({_id: this.userId}); 
}); 

Nur ein Heads-up.