持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第2天，点击查看活动详情juejin.cn/post/714765… v-if和v-for都是通过data里存储的值来更新组件，当data发生改变，组件也会更新。
vue中如何修改状态？
- 直接this.状态名就可以更改。有时候组件状态改了，组件和对象有时候可能不更新。大多数时候发生在状态值是引用类型的时候，基本类型状态更新，状态值都会更新。
- Vue将被监听的数组的编译方法进行了包裹，所以他们也将会触发视图更新，这些被包裹过的方法包括：（哪个方法使原数组更改，那么该方法就是变异的方法）
push（）、pop（）、shift（）、unshift（）、splice（）、sort（），reverse（）- 以上方法视图会监听到，修改之后导致状态变化组件更新渲染。监听的其实是对象指针，如果给数组和对象添加了属性或元素，view可能监听不到。
- 变异方法，顾名思义，会改变调用了这些方法的原始数组。相比之下，也有非变异 (non-mutating method)方法。
- 例如 filter（）、 concat（） 和 slice（）。它们不会改变原始数组，而总是返回一个新数组。
- 当使用非变异方法时，可以用新数组替换旧数组
example1.items = example1.items.filter(function (item) {
return item.message.match(/Foo/)
}）
- 你可能认为这将导致 Vue 丢弃现有 DOM 并重新渲染整个列表。幸运的是，事实并非如此。vue 为了使得 DOM 元素得到最大范国的重用而实现了一些智能的启发式方法，所以用一个含有相同元素的数组去替换原来的数组是非常高效的操作。
。
注意事项：（它涉及的是view和viewModel的双向绑定问题）
做下面的这些事，组件不会更新。
更改数组
- 利用数组索引直接改变一个数组项时，组件不更新。
- 当修改数组长度的时候，组件也不会更解决
- 解决办法（1）：使用Vue.set(
原数组/对象，索引/键名，新的值)方法 - Vue.set()第一个参数是原数组，第二个是索引，第三个是新的值
- 解决办法（2）：使用数组的splice方法。this.arr.splice(要修改元素的下标，1，修改后的值)该方法也可以直接修改数组的长度，（）里写一个数，就修改了数组的长度。
使用全局Vue对象时注意：
全局的Vue对象的方法不能直接使用，但vue会自动把属性和方法传进来，使用vue对象上的属性或方法，再单文件里写成this.$set()，而在入口文件里直接用vue.set()就行。
更改对象
- 对于已经创建的实例，Vue不允许动态添加根级别的响应式属性。但是可以使用Vue.set(Object，proptyName，value)方法向嵌套对象添加响应式属性。
- 如果对象已经创建了，但是想往它里添加一个属性的话，是不行的，viewModel监听不到。尽量避免在操作代码的时候添加属性值。
- 但是我自己发现：如果在添加属性之前修改了对象的某个属性值，添加属性viewModel是可以监听到的。这可能是因为修改状态，然后添加的状态已经存到了状态里，从而更新渲染会把添加的属性也渲染出来。
- 上面示例中splice方法：是把原数组进行渲染，然后进行截取，截取时并没有重新创建
<li></li>标记，而是对"lily"和"小明"所在的<li></li>进行了复用，把另外两个删掉了。
