Soru Yuvalanmış dizi için nasıl düzenlerim?


Kullanıyorum bir eklenti için böyle görünüyor bir devlet olması gerekir:

getInitialState() {
  return {
    invalid: true,
    access: {
      access_code: '',
      zipcode: '',
      password: '',
      confirm: '',
      hospital_id: '',
    },
  }
},

Geri kalanını ayarlamadan hospital_id durumunu nasıl ayarlayabilirim?

Bu, hospital_id dışındaki her şeyi kaldırıyor gibi görünüyor:

this.setState({access: {hospital_id: 1}})

24
2018-01-22 21:45


Menşei


Umarım React bunu yapmak için daha iyi bir yolla çıkar, updateState()Bu sadece orada bulunanları uçurmak yerine geçen anahtarları günceller. Bu geçici çözümlerin tümünü tehlikeli buluyorum çünkü birileri yeni durumu mevcut durumla birleştirmeyi unutursa sessizce “başarısız” olur. - Joshua Pinter
bu nasıl yuvalanmış bir dizi? - orszaczky
Öyle değil, yuvalanmış bir nesne. Vocab benim güçlü takımım değil. - Dan G Nelson


Cevaplar:


Güncelleştirilmiş özelliklere sahip nesnelerin kopyalarını oluşturmak için Object.assign veya nesne yayılma teklifini kullanabilirsiniz.

this.setState({
  access: {
    ...this.state.access,
    hospital_id: 1,
  },
});

this.setState({
  access: Object.assign({}, this.state.access, {
    hospital_id: 1,
  }),
});

Ya da en kısa sürüm ve atomik güncelleme için:

this.setState(({access}) => ({access: {
  ...access,
  hospital_id: 1,
}});

Ve bir seçenek daha güncellemeler addon:

var update = require('react-addons-update');
this.setState({
  access: update(this.state.access, {
    hospital_id: {$set: 1},
  })
});

İlkini kullanırdım.


61
2018-01-22 22:06



React'un en son ES + Babel'i (çoğunlukla) kullandığı düşünüldüğünde, bu kabul edilen cevap olmalıdır. Nesne yayılan operatörü en kısa ve grep olanıdır. - ortonomy
Başar ..... Gerçekten ES6'nın çalışma şeklini seviyorum - Faris Rayhan


let newAccess = Object.assign({}, this.state.access);
newAccess.hospital_id = 1;
this.setState({access: newAccess});


15
2018-01-22 21:50



eyaleti doğrudan değiştirmemelisiniz - Yaron Levi
Ne zamandan beri? Tepki dokümanlar böyle bir kural önermez. - J. Mark Stevens
Doğrudan Durumu Değiştirmeyin - lolsheeplol
SetState kullanmak, durumu dolaylı olarak değiştirmek için önerilen yöntemdir. Şimdi, newAccess = Object.assign ({}, this.state.access); bana daha önce gerçekleşmemiş olan kullanılmalıdır. Bu durumda, başka yerde kullandığım model olduğu için muhtemelen aynı fikirdeyim. - J. Mark Stevens


Bunu şimdi tercih etmenin yolu şu kadar basit:

let newAccess = this.state.access;
newAccess.hospital_id = 1;
setState({access: newAccess});

Mevcut kabul edilen cevaptan biraz daha basit.

DÜZENLE (@SILENT’den yola çıkarak)

Görünüşe göre bu aslında potansiyel olarak tehlikeli bir yöntem. Daha fazla okumak burada Tepki: Değişmezlik hakkında bir (çok kısa) konuşma.

Bunu yapmak için daha iyi bir yol gibi görünüyor:

let newAccess = Object.assign({}, this.state.access, {hospital_id:1});
this.setState({access: newAccess});

2
2018-06-27 18:05



Bu eyaleti mutasyona sokmuyor mu? - SILENT
Haklısın gibi görünüyor. Cevabı güncelledi ve kabul edilen cevabı @FakeRainBrigand tarafından değiştirildi. - Dan G Nelson


Bunu yapmanın bir başka yolu

const newAccess = {...this.state.access};
newAccess.hospital_id = 1;
setState({access: newAccess});

Kullanımı yayılmış operatör bir klon oluşturur this.state.access.


1
2018-01-12 10:54