2016-05-19 28 views
8

React eğitimini kullanarak ve createContainer() işlevini anlamaya çalışırken Meteor üzerinde çalışıyorum. Burada okuma:React kullanarak Meteor'da createContainer ne yapar?

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

Ben onun bir işlev veri yükleme için kullanılır meteor/react-meteor-data tanımlanan düşünüyorum. Bu özel durumda, Mini Mongo Veritabanından veri almak (Task burada). Sorum şu: CreateContainer'ın ikinci argümanı ne yapıyor? (burada App olarak adlandırılmıştır). Teşekkür ederim! bir iş arkadaşınız sorma

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); 

cevap

4

, bu aldığım cevap:.

createContainer 'ın ikinci argüman veri kapsüllü olmak istiyorum sınıf adıdır Daha sonra 'reaktif verileri' olacak Çünkü, DB'deki veriler her değiştiğinde, sınıfın verileri yeni verileri içerecek şekilde değişecektir.

Ayrıca, createContainer() işlevi sınıf tanımının dışında çağrılmalıdır.

Eklemek istediğiniz herhangi bir şey varsa lütfen katkıda bulunmaya çekinmeyin.

8

CreateContainer ile oluşturulan bir bileşen, gerçek bileşenin etrafındaki basit bir sarıcıdır, ancak Meteor'ın sizin için tepkiselliğini ele alması bakımından güçlüdür, böylece verileriniz değiştiğinde her şeyi güncel tutmayı düşünmeniz gerekmez. (örn. bir abonelik yükleri, ReactiveVar/Session var değişiklikleri)

A React bileşeni temel olarak bir JavaScript işlevidir, bir dizi argümanla (sahne) çağrılır ve bir çıktı üretir. Veri, bunu söylemezseniz değiştiyse, bilmiyor. CreateContainer ile oluşturulan bileşen, reaktif verileriniz değiştiğinde yeniden oluşturulacak ve gerçek bileşeninize yeni bir sahne seti gönderecektir.

CreateContainer'ın seçenekleri, istediğiniz reaktif veriyi ve sarmak istediğiniz bileşeni veren bir işlevdir. Çok basit ve createContainer için işlemek işlevi tam anlamıyla bir çizgidir:

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

Size sarılı bileşene geçen herhangi sahne geçer, artı bunu kurmak reaktif veri kaynağı ekler.

Burada kendiniz kodunu görebilirsiniz: https://github.com/meteor/react-packages/blob/devel/packages/react-meteor-data/createContainer.jsx

<Component {...this.props} sözdizimi uyarısı olarak bilinen ve temelde döner edilir:

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

içine:

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

(Bakınız: https://facebook.github.io/react/docs/jsx-spread.html)

0

createContainer'un ikinci argümanı, sahneye geçmek istediğiniz sınıfın adıdır. Yeni firstName giriş veya db güncelleştirilmiş firstName olduğunda , bir prop Şimdi firstName denilen createContainer döner Sağlar ki, o createContainer o yani firstName tutan pervane ile sınıf adıdır ikinci argüman aramak için gidiyor.

Umarım bu mantıklıdır.