Vue.prototype详解

时间:2020-05-09
本文章向大家介绍Vue.prototype详解,主要包括Vue.prototype详解使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

如果需要设置全局变量,在main.js中,Vue实例化的代码里添加。

来自vue官网 https://cn.vuejs.org/v2/cookbook/adding-instance-properties.html
不想污染全局作用域。这种情况下,你可以通过在原型上定义它们使其在每个 Vue 的实例中可用。

Vue.prototype.$appName = ‘My App’

这样 $appName 就在所有的 Vue 实例中可用了,甚至在实例被创建之前就可以。如果我们运行:

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

则控制台会打印出 My App。就这么简单!

你可能会好奇:

“为什么 appName 要以 $ 开头?这很重要吗?它会怎样?”

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

“你指的冲突是什么意思?”

另一个好问题!如果你写成:

Vue.prototype.appName = ‘My App’

那么你希望下面的代码输出什么呢?

 
new Vue({
  data: {
    // 啊哦,`appName` *也*是一个我们定义的实例属性名!						

原文地址:https://www.cnblogs.com/water-no-moon/p/12856681.html