cosa fa createContainer in Meteor usando React?

Question

Sto lavorando su Meteor usando il tutorial di React e cercando di capire createContainer(). Dalla lettura qui:

http://guide.meteor.com/v1.3/react.html#using-createContainer

Penso che la sua una funzione definita in meteor/react-meteor-data che viene utilizzato per il caricamento dei dati. In questo caso specifico, recupera i dati dal Mini Mongo Database (denominato Task qui). La mia domanda è, che cosa fa il secondo argomento per creareContainer? (chiamato App qui). Grazie!

class App extends Component { 
    //...class definition 
} 

export default createContainer(() => { 
    return { 
    //Tasks is a Mongo.Collection 
    //returns the matching rows (documents) 
    //here we define the value for tasks member 
    tasks: Tasks.find({}, { sort: { createdAt: -1} }).fetch(), 
    }; 
}, App); 

Answer 1

Chiedere un collega, questa è la risposta che ho ricevuto:.

s' createContainer secondo argomento è il nome della classe che si desidera che i dati vengano incapsulati in Si avrà quindi 'Dati reattiva' perché ogni volta che i dati nel DB vengono modificati, gli oggetti di scena della classe cambieranno per includere i nuovi dati.

Inoltre, la funzione createContainer() deve essere chiamata all'esterno della definizione della classe.

Se qualcuno ha qualcosa da aggiungere, non esitate a contribuire.

Answer 2

Un componente creato con createContainer è un semplice wrapper per il componente attuale, ma è potente in quanto gestisce la reattività del Meteor per voi in modo da non dover pensare a come mantenere il vostro tutto aggiornato quando i dati modifiche (ad es. una sottoscrizione carica, Variazioni var ReactiveVar/Session)

Un componente React è fondamentalmente solo una funzione JavaScript, viene chiamato con un gruppo di argomenti (oggetti di scena) e produce un output. Reagire non sa se i tuoi dati sono cambiati a meno che tu non lo dica. Il componente creato con createContainer verrà nuovamente sottoposto a rendering quando i dati reattivi cambiano e inviano un nuovo set di oggetti di scena al componente reale.

Le opzioni per createContainer sono una funzione che restituisce i dati reattivi desiderati e il componente che si desidera avvolgere. E 'molto semplice, e la funzione di rendering per createContainer è letteralmente una riga:

return <Component {...this.props} {...this.data} />; 

Si passa attraverso eventuali oggetti di scena si passa al componente avvolto, più esso aggiunge l'origine dei dati reattiva si imposta.

È possibile vedere il codice voi stessi qui: https://github.com/meteor/react-packages/blob/devel/packages/react-meteor-data/createContainer.jsx

La sintassi <Component {...this.props} è conosciuto come un simbolo e in fondo si gira:

{ 
    prop1: 'some value', 
    prop2: 'another value' 
} 

in:

<Component prop1='some value' prop2='another value /> 

(Vedi: https://facebook.github.io/react/docs/jsx-spread.html)

Answer 3

Il secondo argomento diè il nome della classe in cui si desidera passare i puntelli a. consente di dire createContainer restituisce un oggetto di scena chiamato firstName Ora, ogni volta che c'è un nuovo firstName ingresso o una versione aggiornata firstName nel db, quindi createContainer sta per chiamare il secondo argomento che è il nostro nome della classe con il puntello che essa detiene cioè firstName.

Spero che abbia senso.