Vue.prototype的使用方法

一、Vue.prototype 使用方法
main.js里

Vue.prototype.$appName = 'My App'

组件可直接使用如:

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

二、“为什么 appName 要以 $ 开头?这很重要吗?它会怎样?”
$ 是在 Vue 所有实例中都可用的 property 的一个简单约定。这样做会避免和已被定义的数据、方法、计算属性产生冲突。
如果main.js里写成这样

Vue.prototype.appName = 'My App'

此时组件

  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 覆写了。
所以我们通过 $ 为实例 property 设置作用域来避免这种事情发生。