Bir dizi React bileşeninin render sırasını garanti edebilir miyim?

Question

Belirli bir sırayla oluşturmaya çalıştığım bir dizi tepki bileşenim var. Böyle bir şey:

render: function() { 
    var items = stock.map(function(item) { 
    return <NewLI data={item} key={item.id}/> 
    } 
    return <ul>{items}</ul> 
} 

Benim sorunum orijinal dizinin sırayla li en dönmüyor Tepki olmasıdır (gerçek bileşen tek li daha karmaşıktır, ama düzgün bir div sarılır).

baskı items ait id tuşları, bu alın öyleyse: Böyle

items.forEach(function(a) { console.log(a.id) }) 
> 1 
> 2 
> 3 
> 4 

ama benim işlemek tepki görünüyor:

<ul> 
    <li...>2</li> 
    <li...>3</li> 
    <li...>4</li> 
    <li...>1</li> 
</ul> 

bu beklenen davranış mı? Siparişi garanti etmenin bir yolu var mı?

Answer 1

Bu davranış beklenmiyor. Tepki, her zaman elemanları sırayla diziler oluşturur.

Çakışan key öğelerine sahip öğeler varsa, yalnızca en son öğe görüntülenir, ancak öğelerinizin dörtünün tamamı işlendiğinden buradaki durum böyle görünmez.

Özel bir .map() işlevi, başka bir diziyi değil, bir nesneyi döndüren özel bir olasılık mıdır? Nesneler, tarayıcılar arasında mutlaka tutarlı bir şekilde garanti edilmeyen, anahtar yinelemeli olarak işlenecektir.