Маалыматка көптөгөн маанилерди бириктирүүдө кайра рендер болобу?

Ооба, болот. Бирок ар бир белгилөөдө эмес.

Vue реактивдүү системаны колдонуп жатат. Сиз data ичиндеги реактивдүү мүнөзгө жаңы маанини белгилегенде, Vue бул өзгөрүүнү көзөмөлдөйт.

Бир эле код блогундагы үзгүлтүксүз өзгөрүүлөр (мисалы, окуя иштетүүчү же жашоо циклинин hook'унда) адатта бир пландалган жаңыртууга (кайра чагылдыруу) алып келет. Vue бул өзгөрүүлөрдү буферлеп, аларды асинхрон түрдө кийинки "тик"та колдонуп, ашыкча кайра чагылдырууларды алдын алат.

Мисал:

// Vue компоненти
export default {
  data() {
    return {
      count: 0,
      message: 'Салам'
    };
  },
  methods: {
    updateData() {
      // Эки үзгүлтүксүз белгилөө
      this.count = this.count + 1;
      this.message = 'Жаңыланды: ' + this.count;
      // Vue бул жерде *бир* DOM жаңыртуусун пландайт
    }
  }
}

Бул мисалда эки өзгөртүү (this.count жана this.message) реактивдүү маалыматтарда болот, бирок Vue updateData аткарылгандан кийин (же такыр айтканда, кийинки "тик"та) бир гана кайра чагылдыруу жүргүзөт.

Эгер сиз белгилөөлөрдү ар башка асинхрон контексттерде (мисалы, ар башка setTimeout же убадада) жасасаңыз, ар бир мындай өзгөртүү потенциалдуу түрдө өзүнчө кайра чагылдырууга себеп болушу мүмкүн.

Ошондуктан, "бир синхрон блокто dataга бир нече маанини белгилөө" учурда Vue, мүмкүн, бир кайра чагылдыруу жүргүзүп, бардык өзгөртүүлөрдү чагылдырган болот. Бирок, реактивдүү маалыматтарды өзгөртүү ар дайым жаңыртуунун жоспорулушуна алып келет жана акырында DOM кайра чагылдырылат.