课程名称： Vue使用
课程章节：框架面试课
课程讲师： 双越
课程内容：
上次只记了三分之二的内容，这次再记下面的三分之一
11、生命周期（单个组件）
beforeCreate（创建前）：【没数据】
created（创建后） ：【（有数据）没编译】
beforeMount（挂载前）：【有数据（有编译）没挂载】
mounted（挂载后）：【有数据有编译（有挂载）】
beforeUpdate（更新前）：【（数据更新）没渲染】
updated（更新后） ：【数据更新（有渲染）】
beforeDestroy（销毁前）：【实例可用】
destroyed（销毁后）：【实例不可用】
12、生命周期（父子组件）
加载渲染过程：
1.⽗组件 beforeCreate
2.⽗组件 created
3.⽗组件 beforeMount ~~~
4.⼦组件 beforeCreate
5.⼦组件 created
6.⼦组件 beforeMount
7.⼦组件 mounted
8.⽗组件 mounted
更新过程：
1.⽗组件 beforeUpdate ~~~
2.⼦组件 beforeUpdate
3.⼦组件 updated
4.⽗组件 updated
销毁过程：
1.⽗组件 beforeDestroy ~~~
2.⼦组件 beforeDestroy
3.⼦组件 destroyed
4.⽗组件 destoryed
13、Vue高级特性
①v-model
颜色选择器通过自定义的v-model把data进行双向数据绑定
②动态组件
◆：is="component-name”用法
◆需要根据数据，动态渲染的场景。即组件类型不确定。
③异步组件
在用大的组件时如echarts时，需要异步加载组件
◆import0函数
◆按需加载，异步加载大组件
④mixin
mixin的优势：
可以在多个组件有相同逻辑的情况下使用，将相同逻辑抽离出来，然后混入
mixin的劣势：
1.变量来源不明确，不利于阅读。特别是在代码量大，引入多个mixin的情况下。
2.多mixin变量名会冲突，会覆盖。
3.mixin和组件可能出现多对多的关系，复杂度高。一个mixin对多个组件，多个组件对多个mixin
14.vuex知识点
15.vue-router
h5 history配置
Vue-router路由配置动态路由
Vue-router路由配置懒加载（相当于异步加载，优化性能）
16、总结
①v-show 和 v-if 的区别？什么时候用v-show，什么时候用 v-if？
v-if 是dom的完整销毁和重建，v-show是css切换（display：none）
频繁切换时使用v-show，运行较少改变时用v-if
②为何v-for 要用key?
首先，我们知道Vue中使用V-for一定要用key，且这个key不能是index或者random，但是具体原因是什么，我们需要在下节课中具体解释。
③描述Vue组件生命周期（有父子组件的情况）
生命周期（单个组件）
beforeCreate（创建前）：【没数据】
created（创建后） ：【（有数据）没编译】
beforeMount（挂载前）：【有数据（有编译）没挂载】
mounted（挂载后）：【有数据有编译（有挂载）】
beforeUpdate（更新前）：【（数据更新）没渲染】
updated（更新后） ：【数据更新（有渲染）】
beforeDestroy（销毁前）：【实例可用】
destroyed（销毁后）：【实例不可用】
生命周期（父子组件）
加载渲染过程：
1.⽗组件 beforeCreate
2.⽗组件 created
3.⽗组件 beforeMount ~~~
4.⼦组件 beforeCreate
5.⼦组件 created
6.⼦组件 beforeMount
7.⼦组件 mounted
8.⽗组件 mounted
更新过程：
1.⽗组件 beforeUpdate ~~~
2.⼦组件 beforeUpdate
3.⼦组件 updated
4.⽗组件 updated
销毁过程：
1.⽗组件 beforeDestroy ~~~
2.⼦组件 beforeDestroy
3.⼦组件 destroyed
4.⽗组件 destoryed
④Vue组件如何通讯？
1.父子组件通讯，用属性和触发事件的方式
2.两个组件没关系或层级比较深，用自定义事件的方式
3.vuex的通讯，
⑤描述组件渲染和更新的过程
这个问题暂时还不能回答
⑥双向数据绑定v-model的实现原理
这个问题暂时还不能回答
本节课暂时只能解决这些问题，剩下的问题还需要等学习了接下来的知识才能解答
共同学习，写下你的评论
评论加载中...
作者其他优质文章
