当前位置: 首页 > Web前端 > vue.js

为什么vue

时间:2023-04-01 02:06:09 vue.js

vue中的dataamethoddata,props,computed等顺序是一样的initStateprops->methods->data->compute->watchif(opts.props)initProps(vm,opts.props)if(opts.methods)initMethods(vm,opts.methods)if(opts.data){initData(vm)}else{observe(vm._data={},true/*asRootData*/)}if(opts.computed)initComputed(vm,opts.computed)if(opts.watch&&opts.watch!==nativeWatch){initWatch(vm,opts.watch)}父组件属性改变父组件改变属性,如果子组件直接使用props,它会触发子组件更新父组件来改变props。如果子组件将props放入数据中,然后使用它,则不会触发子组件更新父组件以更改props。如果子组件将props放入computed中使用,会触发子组件更新响应getter用于收集依赖项。收集依赖关系的目的是为了知道当响应式数据发生变化时触发setter时应该通知哪些订阅者。做相应的逻辑处理。在setter中,如果没有找到反应对象,则新设置的值成为反应对象。在setter中执行dep.notify()以通知所有订阅者。当数据发生变化时,触发setter逻辑,所有在依赖进程中订阅的观察者,即观察者,触发其更新过程。这个过程使用队列做进一步的优化,并在nextTick之后执行所有watcher的运行,最后执行它们的回调函数数据变化到DOM重新渲染是一个异步过程,发生在nexttick。这就是我们通常在开发过程中所做的事情。比如我们从服务器接口获取数据的时候,修改了数据。如果我们的某些方法依赖于数据修改后的DOM变化,我们必须在nextTick之后执行sameVnode逻辑很简单,如果两个vnode的key不相等,则不同;否则继续判断同步组件的isComment、数据、输入类型等是否相同,异步组件的asyncFactory是否相同