1. nextTick详解:
在Vue生命周期的created()/mounted()钩子函数进行的DOM操作一定要放在Vue.nextTick()的回调函数中[原因是在created()/mounted()钩子函数执行的时候DOM 其实并未进行任何渲染,而此时进行DOM操作无异于徒劳,所以此处一定要将DOM操作的js代码放进Vue.nextTick()的回调函数中]。如果我们想对未来更新后的视图进行操作,我们只需要把要执行的函数传递给this.$nextTick方法。
mounted: function () {
this.$nextTick(() => {
this.get()
})
},
methods:{
get:{
//dom操作
}
}
2. MVVM原理
MVVM是对MVC的一张进化,M是Model模型即后台传输过来的数据,V是View即我们看到的页面,VM是ViewModel即视图-模型(主要负责业务逻辑的处理),VM是Model和View之间的桥梁,两者之间不能直接通信,需要通过ViewModel。两者通信有两个方向:一个是Model到View,即从数据到页面展示,主要通过数据绑定实现;另一个是View到Model,即从页面到数据,主要通过dom事件监听实现。同时实现这两个方向叫数据的双向绑定,ViewModel要实现一个observer观察者,当数据发生变化,ViewModel能够监听到数据的变化,然后通知到对应的视图做自动更新,当用户操作视图,ViewModel也能监听到视图的变化,然后通知数据做改动,这实际上就实现了数据的双向绑定。
MVVM的设计思想是关注Model变化,让MVVM框架去自动更新DOM的状态,从而把开发者从操作DOM的繁琐步骤中解脱出来。