Data daxilində ardıcıl çoxlu dəyərlər təyin edilərkən yenidən render olunacaqmı?

Bəli, olacaq. Hətta hər təyin etmədə deyil.

Vue reaktiv sistemdən istifadə edir. data içində reaktiv xüsusiyyətə yeni dəyər təyin etdiyiniz zaman, Vue bu dəyişiklikləri izləyir.

Eyni kod blokunda ardıcıl dəyişikliklər (məsələn, hadisə idarəçisi və ya həyat dövrü hook-u daxilində) adətən bir planlaşdırılmış yeniləməyə (yenidən render) səbəb olur. Vue bu dəyişiklikləri tamponlayır və növbəti "tick"-də asinxron şəkildə tətbiq edir, artıq yenidən renderləri qarşısını almaq üçün.

Nümunə:

// Vue komponenti
export default {
  data() {
    return {
      count: 0,
      message: 'Salam'
    };
  },
  methods: {
    updateData() {
      // İki ardıcıl təyin etmə
      this.count = this.count + 1;
      this.message = 'Yeniləndi: ' + this.count;
      // Vue burada *bir* DOM yeniləməsini planlaşdırır
    }
  }
}

Bu nümunədə, hər iki dəyişiklik (this.count və this.message) reaktiv verilərdə baş verir, lakin Vue updateData-nın icrasını tamamladıqdan sonra (və ya daha dəqiq desək, növbəti "tick"-də) yalnız bir yenidən render həyata keçirəcək.

Lakin, əgər siz müxtəlif asinxron kontekstlərdə (məsələn, müxtəlif setTimeout və ya vədlər daxilində) təyin etmələr edirsinizsə, hər bir dəyişiklik potensial olaraq ayrı-ayrı yenidən renderə səbəb ola bilər.

Beləliklə, "data-da ardıcıl çoxsaylı dəyərlərin təyin edilməsi" halında, Vue ehtimal ki, bir yenidən render həyata keçirəcək və bütün dəyişiklikləri əks etdirəcək. Amma, reaktiv veriləri dəyişdirmək hər zaman yeniləmənin planlaşdırılmasına səbəb olur və nəticədə DOM-un yenidən render olunmasına gətirib çıxarır.