The Vue Instance（Vue实例）

当创建一个Vue实例时，它将在其data对象中找到的所有属性添加到Vue的反应性系统中。当这些属性的值改变时，视图将“反应”更新以匹配新值。

// Our data object
var data = { a: 1 }

// The object is added to a Vue instance
var vm = new Vue({
  data: data
})

// These reference the same object!
vm.a === data.a // => true

// Setting the property on the instance
// also affects the original data
vm.a = 2
data.a // => 2

// ... and vice-versa
data.a = 3
vm.a // => 3

当这个数据改变时，视图将会重新渲染。应该注意的是，如果在创建实例时存在属性，data它们只是被动的。这意味着如果你添加一个新的属性，如：

vm.b = 'hi'

然后更改为b不会触发任何视图更新。如果您知道以后需要一个属性，但它开始是空的或不存在的，则需要设置一些初始值。例如：

data: {
  newTodoText: '',
  visitCount: 0,
  hideCompletedTodos: false,
  todos: [],
  error: null
}

除了数据属性之外，Vue实例还公开了许多有用的实例属性和方法。这些前缀$用于区分它们与用户定义的属性。例如：

var data = { a: 1 }
var vm = new Vue({
  el: '#example',
  data: data
})

vm.$data === data // => true
vm.$el === document.getElementById('example') // => true

// $watch is an instance method
vm.$watch('a', function (newValue, oldValue) {
  // This callback will be called when `vm.a` changes
})

每个Vue实例在创建时都会经历一系列初始化步骤 - 例如，它需要设置数据观察，编译模板，将实例安装到DOM以及在数据更改时更新DOM。一路上，它还运行称为生命周期的函数，使用户有机会在特定阶段添加自己的代码。

例如，created可以使用挂钩在创建实例后运行代码：

new Vue({
  data: {
    a: 1
  },
  created: function () {
    // `this` points to the vm instance
    console.log('a is: ' + this.a)
  }
})
// => "a is: 1"