Sobes.tech
Middle

Da li će doći do ponovnog renderovanja pri višestrukom dodeljivanju vrednosti u data?

sobes.tech АИ

Одговор од АИ

Da, biće. Iako ne pri svakoj dodeli.

Vue koristi reaktivni sistem. Kada dodelite novu vrednost reaktivnoj svojstvu u data, Vue prati tu promenu.

Sekvencijalne promene u istom bloku koda (na primer, unutar handlera događaja ili hook-a životnog ciklusa) obično dovode do jednog planiranog ažuriranja (ponovnog renderovanja). Vue kešira te promene i primenjuje ih asinhrono u sledećem "tick"-u ciklusa ažuriranja, da bi izbegao suvišna ponovna renderovanja.

Primer:

// Vue komponenta
export default {
  data() {
    return {
      count: 0,
      message: 'Zdravo'
    };
  },
  methods: {
    updateData() {
      // Dve uzastopne dodelbe
      this.count = this.count + 1;
      this.message = 'Ažurirano: ' + this.count;
      // Vue će ovde planirati *jedno* ažuriranje DOM-a u sledećem "ticku"
    }
  }
}

U ovom primeru, obe promene (this.count i this.message) će se desiti u reaktivnim podacima, ali Vue će izvršiti samo jedno ponovno renderovanje nakon što se updateData završi (ili, preciznije, u sledećem "ticku").

Međutim, ako izvršavate dodeljivanja u različitim asinhronim kontekstima (na primer, u različitim setTimeout ili obećanjima), svaka takva promena potencijalno može izazvati zasebno ponovno renderovanje.

Dakle, kod "više uzastopnih dodela vrednosti u data" unutar jednog sinhronog bloka, Vue će verovatno izvršiti jedno ponovno renderovanje koje će odraziti sve promene. Ali, sama činjenica da menjate reaktivne podatke uvek dovodi do planiranja ažuriranja, što na kraju rezultira ponovnim renderovanjem DOM-a.