虽然 vue 是通过数据驱动视图, 但是数据变化之后,Vue 异步执行 DOM 更新，视图的更新并没有立即完成。
为了在数据变化之后等待 Vue 完成更新 DOM ，可以在数据变化之后立即使用 Vue.nextTick(callback) 。这样回调函数在 DOM 更新完成后就会调用。
nextTick官网
this.$nextTick() 方法可以保证：数据变化、视图通过响应式完成页面更新后，调用回调函数。
应用场景：
Vue生命周期的created() 钩子函数进行的DOM操作，一定要放在Vue.nextTick() 的回调函数中，因为created() 执行的时候，DOM实际上并未进行任何渲染，此时进行DOM操作无异于徒劳，所以此处一定要将DOM操作的js代码放进Vue.nextTick()的回调函数中。
在生命周期的mounted() 钩子函数中进行任何DOM操作都不会有问题，因为mounted() 函数执行时，所有的DOM挂载和渲染都已完成。
在data数据变化后要执行的某个操作，而这个操作需要使用随数据改变而改变的DOM结构的时候，这个操作应该放进Vue.nextTick() 的回调函数中。
结论：
如果在data数据改变之后的操作，跟视图更新改变之后的DOM有关，那么就应该使用Vue.nextTick()方法。