-
课程名称：前端框架及项目面试 聚焦Vue3/React/Webpack
-
课程章节： vue基本知识点串讲-part2
-
主讲老师：双越
课程内容：
今天学习的内容包括：
vue基本知识点串讲-part2
课程收获：
如何遍历对象
可以使用v-for遍历，key尽量保持唯一，不要使用random或者index
v-for和v-if不能一起使用
v-for 和 v-if 同时使用有 3 种情景：
部分遍历（内/外部条件）：一个 list 中某个属性值符合条件的遍历出来；
全部遍历（外部条件）：某外部条件符合条件时遍历全部。
全部遍历（内部条件）：根据某内部条件渲染出不同的内容。
注：内部条件指被遍历数据内部属性值或条件；外部条件指与独立于被遍历数据以外的数据。
会造成性能的浪费，在vue2中会优先执行 v-for, 当 v-for 把所有内容全部遍历之后 , v-if 再对已经遍历的元素进行删除 , 造成了加载的浪费 , 所以应该尽量在执行 v-for 之前优先执行 v-if , 可以减少加载的压力。
解决方案为（1）、循环前可以先剔除不要的数据，例如在计算属性中先用内/外部条件处理数据，再遍历处理后的数据（2）、外部条件放到遍历的父级元素上，没有父级可以使用。根据某内部条件，显示不同内容。注意 key 不能放 template 标签上。
事件修饰符，按键修饰符
今天学习课程共用了35分钟，重新了解了一下vue基本知识点，这是我不知道第多少次决心补习面试题，希望能够坚持下去。