Skip to content

父子组件生命周期等其他基础

🕒 Published at:

父子组件生命周期

text
-->父子组件生命周期
	父beforeCreate
	父created
	父beforeMount
	    子beforeCreate
	    子created
	    子beforeMount
	    子Mounted
	父Mounted
	父beforeUpdate
	    子beforeUpdate
	    子updated
	父updated
	父beforeDestroy
	    子beforeDestroy
	    子destroyed
	父destroyed

computed 和 methods 的区别

js
computed 当做属性使用 methods 则当做方法调用
computed 可以具有 getter setter因此可以赋值 methods 不行
computed 无法接收多个参数 methods 可以
computed 具有缓存 methods 没有
computed 代理到组件实例的同时,会生成一个函数,根据dirty判断是否触发get,而methods仅复制引用到组件实例

computed 和 watcher 的区别

js
computed和watcher都可以观察数据变化

区别:
//依赖操作多对一与一对一,同步异步,缓存,是否代理,触发时机(初始化是否触发,是否深度)
computed是多个依赖对应一系列操作,watcher是一个响应式对应一系列操作
computed会被代理到在组件实例身上,watcher不会
computed利用get,set函数是同步执行的,watcher利用handler可以异步执行
computed会缓存get的返回值,依赖的值不变化不会重新触发handler,watcher不具有缓存
computed页面初始化渲染时,如果使用了就会触发,watcher根据配置项immediate决定要不要初始化时触发
computed监视依赖本身的变化,watcher可以通过配置项deep开启深度监视

vue 的优点

  1. 响应式编程:将数据进行代理, 使其能够对页面中的部分数据变化做出响应

  2. 组件式化:将页面具有类似 UI, 相似操作的部分进行封装, 使其可以复用, 提高开发效率

  3. 指令化:当具有类似 UI, 相似操作的部分仅为单个 DOM 时, 采用指令

  4. 虚拟 DOM:将 DOM 转变为虚拟 DOM 对象, 对 DOM 操作进行预处理, 减少不必要的渲染