En iyi uygulama: bileşenleri yeniden kullan veya kopyaları yaz

Question

Bir mağaza yönetiminde tepki, alt ve değişmez olarak çalışıyorum. Teklifim nesne az ya da çok şuna benzer: Her bir girişin üzerine yineleme ve, grup, makaleyi düzenlemek için bir form görüntülemek

offer: { 
    groups: [{ 
    articles: [{ 
     optionGroups: [{ 
      options: [] 
     }] 
    }] 
    }] 
} 

.... Bir şey değiştirilirse, bir OfferAction çağırır ve yolu, değişmiş alanı ve yeni değeri varlığa (örn.) Iletirim. OfferActions.update([2, 'articles', 5, 'optionGroups'], 'name', 'MyOptionGroup')

Şimdi farklı tutucuları ve changeHandlers ile değil, aynı formunu görüntülemek istediğiniz. Bir form doldurulursa, varlık oluşturulmalıdır (farklı bir OfferAction çağrılmalıdır). Bunu yapmak için en iyi uygulama nedir?

aşağıdaki olanakları hakkında düşündü: OfferStore durumuna

itin boş Elemanları
boş elemanlar diğerleri gibi görüntülenecektir. Herhangi bir bileşeni çoğaltmam gerekmiyor, ancak bir değişiklikten sonra yer tutucularının işlenmesini ve eksik kalmaları durumunda gizlenecek değerleri belirlemesi için birden çok çekişe ihtiyacım var. Varlık oluşturulduktan sonra teklif dizisine yeni bir boş öğe daha iteyim.

Sadece işlemek ikinci bileşeni oluşturabilir
2 bileşenini oluşturur. Formu bir iç durum aracılığıyla yönetirim, form doldurulduğunda varlığı oluşturur ve durumu sıfırlar. Bu yinelenen jsx bir yağma yol açacaktır.

bileşeni çoğaltarak veya diğerlerini sorunlara neden olmadan bu, arşivlemiştik herhangi en iyi yöntem var mı?

Answer 1

Yani farklı yer tutucular ve değiştiriciler istiyor musunuz?

çoğaltılamaz gereken üst düzey bileşeni üzerinde bir boolean pervane ayarlayın. Daha sonra, her bir yer tutucu/changeHandler için;

if(this.props.someBooleanValue){ 
    //alternate action or placeholder 
} else { 
    //original action or placeholder 
} 

-olduğu gibi orijinalleri bırakın alternatif sürümlerinde someBooleanValue={true} ekleyin.

Answer 2

sadece küçük farklılıklar vardır çünkü ben sana ilk ihtimalini tavsiye, bu nedenle her iki durum için bir oluşturucusunu oluşturmak istiyorum.

(grupları için yazılar e.t.c) her bir alana boş elemanlar için bir alan içeren karşılık gelen JSON nesnesi ekleyin ve doğru, örneğin ayarlayın isNew = true. Bunu böyle yaparsanız, tüm elementler için aynı changehandler'ı kullanabilirsiniz. Güncelleme için

gerekli Infos JSON nesnesi olan ve yeni bir öğe oluşturmak için varsa sadece isNew bayrağını kontrol edin. Ekledikten sonra, bayrağı yanlış olarak ayarlayın ve mevcut olanlardan biri gibi ele alabilirsiniz.