Vue的一些知识要点

• 计算属性和过滤器都需要把value值在return出去，
  data
  props
  propsData
  computed
  methods
  watch这些是数据可以直接使用
  变异方法（修改原有的数据）
• push（）
• pop（）
• shift（）
• unshift（）
• splice（）
• sort（）
• reverse（）
  这些只是修改原有数据而已
  替换数组（会生成新的数组）
• filter（）
• contact（）
• slice（）slice 会提取原数组中索引从 begin 到 end 的所有元素（包含 begin，但不包含 end）。
  其实都是一些js原生API

注意事项

由于 JavaScript 的限制，Vue 不能检测以下数组的变动：
1，当你利用索引直接设置一个数组项时，例如vm.items[indexOfItem] = newValue
2.当你修改数组的长度时，例如：vm.items.length = newLength
举个例子：

var vm = new Vue({
  data: {
    items: ['a', 'b', 'c']
  }
})
vm.items[1] = 'x' // 不是响应性的
vm.items.length = 2 // 不是响应性

为了解决第一类问题，以下两种方式都可以实现和 vm.items[indexOfItem] = newValue 相同的效果，同时也将在响应式系统内触发状态更新：

// Vue.set
Vue.set(vm.items, indexOfItem, newValue)

// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)

你也可以使用 vm.$set 实例方法，该方法是全局方法 Vue.set 的一个别名：

vm.$set(vm.items, indexOfItem, newValue)

为了解决第二类问题，你可以使用 splice：

vm.items.splice(newLength)

总结方法关于修改响应式数据

• Vue.set(vm.items, indexOfItem,newValue)
• vm.$set(vm.items, indexOfItem, newValue)
  参数一表示要处理的数组名称
  参数二表示要处理的数组的索引
  参数三表示要处理的数组的值

var vm = new Vue({
	el: '#app',
	data(){
	return {
		list: ['apple', 'pear', 'cherry'],
		info: {
			name: 'jack',
			age: 18
		}
})
Vue.set(vm.list, 2, 'watermelon') or 
vm.$set(vm.list, 1, 'lemon')

vm.$set(vm.info, 'gender', 'male')

对于已经创建的实例，Vue 不允许动态添加根级别的响应式属性。但是，可以使用 Vue.set(object, propertyName, value) 方法向嵌套对象添加响应式属性。例如，对于：
vm.$set(vm.info, 'gender', 'male')你也可以通过Vue.set(vm.info, 'gender', 'male'),vm.$set 实例方法，它只是全局 Vue.set 的别名