那些关于前端的Vue(1)

Vue组件生命周期

1.单组件
创建阶段（1次）–> 更新阶段 --> 销毁阶段（执行1次）
（1）创建阶段（挂载阶段）
(初始化事件和生命周期) beforeCreate–>created（页面还没有渲染，但是vue已经初始实例化完成）–>beforeMount–>render–>mounted（此时的页面已经渲染完） （异步请求、操作DOM、定时器等）
（2）更新阶段(可以多次调用)
(依赖数据改变或$forceUpdate强制刷新)->beforeUpdate(移除已经添加的事件监听器等 万万不可更改依赖数据)–>render–>updated
（操作DOM添加事件监听器等 不能更改依赖数据 否则会造成死循环直到浏览器爆掉）
（3）销毁阶段
beforeDestroy(移除已经添加的事件监听器)–destroy
2.有父子组件
挂载阶段：创建created是由外到内的，渲染mounted是由内到外的
更新阶段：beforeupdate是由外到内，update是由内到外的
销毁阶段：beforedestroy是由外到内，destroy是由内到外的

v-show和v-if的区别

· v-show通过css 的display控制显示和隐藏
· v-if是真正上的渲染和销毁，而不是隐藏和显示
· 那么对于频繁切换的情景则适合使用v-show，否则使用v-if

为何v-for中要用key

没想到在vue中不写key居然会报警告，而且其中的key不能随便写，不允许random或者是index。key的作用需要让每个item有一个独立的标识符，高效的更新虚拟DOM（更新页面不需要操作DOM，而是只操作数据即可重新渲染），而这用到背后的原理其实是高效率的diff算法。
· diff算法通过tag和key来判断是不是samenode，以此来减少渲染的次数，提升渲染性能

以上都按照个人理解所写出来，如有错误麻烦指正，谢谢