亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

Wie erkennt man, wann eine Vue-Komponente vollst?ndig initialisiert ist?
P粉909476457
P粉909476457 2024-04-05 14:20:24
0
1
1880

In meiner Vue-Komponente habe ich also eine Asynchronit?t created方法和幾個(gè)帶有異步watcher的變量。這些變量被一些組件template部分中的元素用作v-model. Der Watcher ruft andere Methoden auf, um die Werte dieser Variablen zu ?ndern.

Dieser Vorgang wird eine Weile (Hunderte von Millisekunden) fortgesetzt, bis alle Daten initialisiert sind und sich keine Variablen ?ndern. Jetzt habe ich Code, der ausgeführt werden muss, wenn für alle Variablen Anfangswerte definiert sind. Aber die Frage ist: Woher wei? ich, dass der gesamte Code in der Komponente ausgeführt wurde?

Natürlich kann ich das am Ende der created方法的末尾運(yùn)行我的代碼,但是由于template部分中的一些元素正在更新它們用作v-model的變量,這些watcher獨(dú)立于created方法運(yùn)行,而created方法在watcher之前完成得多。甚至mounted方法在watcher之前退出。因此,我不能只是把代碼放在created-Methode machen.

Meine Frage ist also: Wie kann ich am Ende der Komponenteninitialisierung Code ausführen? Führen Sie es also aus, nachdem der mit der Variablen created方法之后,以及在所有與變量值更改相關(guān)的watcher完成之后?我只是說關(guān)于watcher的初始運(yùn)行,這是由v-model的初始化引起的,這是由script部分中元素的初始化引起的,而不是組件生命周期中稍后的watcher執(zhí)行。所以,我需要在script部分的元素完成初始化和與它們的v-model verknüpfte Watcher ausgeführt wurde.

Wie geht das?

P粉909476457
P粉909476457

Antworte allen(1)
P粉724256860

您可以使用布爾標(biāo)志的數(shù)組,用于監(jiān)視您需要監(jiān)視的任何數(shù)量的事物。它們都初始化為一個(gè)單獨(dú)的數(shù)組,初始值為false,每個(gè)監(jiān)視器負(fù)責(zé)將不同的索引設(shè)置為true。一旦所有監(jiān)視器都運(yùn)行完畢,所有標(biāo)志都為true 并通過觀察該數(shù)組,您可以知道所有內(nèi)容都已初始化。

export default {
  data() {
    return {
      initialized: [false, false],
      watch1: null,
      watch2: null,
      isDone: false
    }
  },
  watch: {
    watch1(newVal) {
      if (newVal) {
        this.initialized[0] = true
      }
    },
    watch2(newVal) {
      if (newVal) {
        this.initialized[1] = true
      }
    },
    initialized: {
      handler: function (newVal) {
        if (newVal.every(i => i)) {
          this.isDone = true // initialization is completely done
        }
      },
      deep: true
    }
  },
  created() {
    setTimeout(() => {
      this.watch1 = 'some value1'
    }, 2000)

    setTimeout(() => {
      this.watch2 = 'some value2'
    }, 3000)
  }
}

Vue Playground示例

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage