Was sind die drei Elemente der Vue-Richtlinie?

Die drei Elemente der Vue-Direktive sind Reaktionsfähigkeit, Template-Engine und Rendering. Reaktionsfähigkeit bedeutet, dass die Seite reagiert und die entsprechenden Daten neu gerendert werden; die Vorlage-Engine ist im Wesentlichen eine Zeichenfolge, die als Kennung der Instanz verwendet wird andere Codes.

Die Betriebsumgebung dieses Artikels: Windows 10-System, Vue Version 2.9.6, DELL G3-Computer.

Was sind die drei Elemente der Vue-Direktive?

Drei Elemente in Vue

• Reaktionsfähigkeit: Wie überwacht Vue jede Attributänderung von Daten?

• Template Engine: Wie wird die Vorlage von Vue analysiert und wie Wird die Weisung bearbeitet?

• Rendering: Wie wird die Vorlage von Vue in HTML gerendert? Und der Rendering-Prozess wird als Responsive implementiert Attribut, Vue überwacht sofort die

data-Eigenschaft und wird an die VM weitergeleitet

2) Object.defineProperty Syntax:

Object.defineProperty

Parameterbeschreibung:

obj: erforderlich. Zielobjekt

prop: Erforderlich. Der Name des Attributs, das definiert oder geändert werden soll

Deskriptor: erforderlich. Die Eigenschaften des Zielattributs

Basic

• Object.defineProperty(obj, prop, descriptor)

  Wir verwenden die Methode defineProperty, um die obige Operation zu implementieren: wie folgt

  var obj = {
    name: 'zhangsan',
    age: 25
  }
   
  console.log(obj.name); // 获取属性的时候，如何监听
  obj.age = 26; // 赋值属性的时候，如何监听

Mit defineProperty können wir Datenänderungen überwachen. Dies ist auch die Kernmethode für Vue, um Antwortarbeit zu leisten.

• 3) So simulieren Sie, dass die Vorlage von

• var obj = {}
   
  var name = 'zhangsan'
   
  Object.defineProperty(obj, "name", {
    get: function () {
      console.log('get');
      return name;
    },
    set: function (newVal) {
      console.log('set');
      name = newVal;
    }
  });
   
  console.log(obj.name); // 可以监听到
  obj.name = 'lisi'; // 可以监听到

  vue analysiert wird.

Was ist die Vorlage?

hat Logik, wie z. B. v-if v-for usw.

ist dem HTML-Format sehr ähnlich, es gibt jedoch einen großen Unterschied.

Es wird schließlich zur Anzeige in HTML konvertiert.

Die Vorlage muss schließlich konvertiert werden in JS-Code, denn: hat Logik ( v-if v-for), sie muss mit JS realisiert werden (Turing vollständig)

Die Konvertierung in die HTML-Rendering-Seite muss mit JS realisiert werden

Daher ist das Wichtigste um die Vorlage in eine JS-Funktion umzuwandeln

Einfaches Beispiel

var mv = {}
 
var data = {
  price: 100,
  name: 'zhangsan'
}
 
var key, value;
for (key in data) {
 
  // 命中闭包。新建一个函数，保证 key 的独立的作用域
  (function (key) {
Object.defineProperty(mv, key, {
  get: function () {
    console.log('get');
    return data[key];
  },
  set: function (newVal) {
    console.log('set');
    data[key] = newVal
  }
})
  })(key);
}

Das Obige ist eine Vorlage.

【Verwandte Empfehlung: „vue.js Tutorial“】

Das obige ist der detaillierte Inhalt vonWas sind die drei Elemente der Vue-Richtlinie?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!