Kas toimub, kui andmetele järjepidevalt määratakse mitu väärtust?
sobes.tech AI
Vastus AI-lt
Jah, see toimub. Kuigi mitte iga omistamise korral.
Vue kasutab reaktiivset süsteemi. Kui omistate uue väärtuse reaktiivsele omadusele data-s, jälgib Vue seda muutust.
Järjepidevad muudatused samas koodiblokis (näiteks sündmuse käsitleja või elutsükli hooki sees) tavaliselt põhjustavad ühe planeeritud uuenduse (uuesti renderdamise). Vue bufeerib need muudatused ja rakendab need asünkroonselt järgmise "tikiga" uuendustsükli ajal, et vältida liigseid uuesti renderdusi.
Näide:
// Vue komponent
export default {
data() {
return {
count: 0,
message: 'Tere'
};
},
methods: {
updateData() {
// Kaks järjestikust omistamist
this.count = this.count + 1;
this.message = 'Uuendatud: ' + this.count;
// Siin Vue planeerib *ühe* DOM-i uuenduse järgmisel tikil
}
}
}
Selles näites toimuvad mõlemad muudatused (this.count ja this.message) reaktiivsetes andmetes, kuid Vue teostab uuesti renderdamise ainult ühe korra pärast updateData täitmise lõppu (või täpsemalt, järgmise tikiga).
Kui aga teete omistamisi erinevates asünkroonsetes kontekstides (näiteks erinevate setTimeout-ide või lubaduste sees), võib iga selline muudatus potentsiaalselt põhjustada eraldi uuesti renderdamise.
Seega, kui "mitu väärtuse omistamist data-sse järjest" toimub ühe sünkroonilise ploki sees, siis Vue tõenäoliselt teostab ühe uuesti renderdamise, mis kajastab kõiki toimunud muudatusi. Kuid reaktiivsete andmete muutmise fakt ise põhjustab alati plaanimise uuenduse, mis lõpuks viib DOM-i uuesti renderdamiseni.