So verwenden Sie vue.prototype

So verwenden Sie vue.prototype: Machen Sie es in jeder Vue-Instanz verfügbar, indem Sie es auf dem Prototyp definieren. Der Code lautet [Vue.prototype.$appName = 'My App'] und die Konsole druckt My App aus.

Die Betriebsumgebung dieses Tutorials: Windows10-System, vue2.5.2, dieser Artikel gilt für alle Computermarken.

【Empfohlene verwandte Artikel: vue.js】

vue.prototype-Verwendung:

In der main.js-Datei des Vue-Projekts:

Vue.prototype.$appName = 'My App'

Auf diese Weise können Sie es zum Laufen bringen, indem Sie sie auf dem Prototyp definieren Verfügbar in jeder Instanz von Vue.

new Vue({
  beforeCreate: function () {
    console.log(this.$appName)
  }
})

Die Konsole druckt „Meine App“ aus. So einfach ist das!

„Warum beginnt appName mit $? Ist es wichtig? Was passiert damit?“ $ 开头？这很重要吗？它会怎样？”

$是在 Vue 所有实例中都可用的属性的一个简单约定。这样做会避免和已被定义的数据、方法、计算属性产生冲突。

比如写成：

Vue.prototype.appName = 'My App'

在vue实例中：

new Vue({
  data: {
    appName: 'The name of some other app'
  },
  beforeCreate: function () {
    console.log(this.appName)
  },
  created: function () {
    console.log(this.appName)
  }
})

日志中会先出现 "My App"，然后出现 "The name of some other app"，因为 this.appName 在实例被创建之后被 data 覆写了。我们通过 $ 为实例属性设置作用域来避免这种事情发生。你还可以根据你的喜好使用自己的约定，诸如 $_appName或 ΩappName

$ ist eine einfache Eigenschaft, die in allen Instanzen von Vue Agreement verfügbar ist . Dadurch werden Konflikte mit definierten Daten, Methoden und berechneten Eigenschaften vermieden.

Schreiben Sie zum Beispiel: rrreeeIn der Vue-Instanz:

rrreee

„Meine App“ erscheint zuerst im Protokoll und dann erscheint „Der Name einer anderen App“, da this.appName durch Daten überschrieben wird nachdem die Instanz erstellt wurde. Wir verhindern, dass dies geschieht, indem wir den Bereich für Instanzeigenschaften über $ festlegen. Wenn Sie möchten, können Sie auch Ihre eigene Konvention verwenden, z. B. $_appName oder ΩappName, um Konflikte mit Plugins oder zukünftigen Plugins zu vermeiden. 🎜🎜🎜Verwandte kostenlose Lernempfehlungen: 🎜JavaScript🎜 (Video) 🎜🎜

Das obige ist der detaillierte Inhalt vonSo verwenden Sie vue.prototype. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!