Comment utiliser vue.prototype

Comment utiliser vue.prototype : définissez-le sur le prototype pour le rendre disponible dans chaque instance de Vue. Le code est [Vue.prototype.$appName = 'My App'] et la console l'imprimera. Mon application.

L'environnement d'exploitation de ce tutoriel : système windows10, vue2.5.2, cet article est applicable à toutes les marques d'ordinateurs.

[Recommandations d'articles connexes : vue.js]

Comment utiliser vue.prototype :

dans Dans le fichier main.js du projet vue :

Vue.prototype.$appName = 'My App'

De cette façon, vous pouvez les rendre disponibles dans chaque instance de Vue en les définissant sur le prototype.

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

La console imprimera Mon application. C'est aussi simple que ça !

"Pourquoi appName commence-t-il par $ ? Est-ce important ? Que fait-il ?"

$ est une convention simple pour les propriétés disponibles dans toutes les instances de Vue. Cela évitera les conflits avec les données, méthodes et propriétés calculées définies.

Par exemple, écrivez :

Vue.prototype.appName = 'My App'

Dans l'instance de vue :

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

"Mon application" apparaîtra en premier dans le journal, puis "Le nom d'une autre application " apparaîtra, car this.appName est écrasé par les données après la création de l'instance. Nous évitons que cela ne se produise en définissant la portée des propriétés de l'instance via $ . Vous pouvez également utiliser vos propres conventions, telles que $_appName ou ΩappName, si vous préférez, pour éviter les conflits avec les plugins ou les futurs plugins.

Recommandations d'apprentissage gratuites associées : JavaScript (vidéo)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!