vue父子组件生命周期执行顺序 & v-on的常用修饰符 & v-for 中key的作用

一：vue父子组件生命周期执行顺序

挂载阶段：

父 beforeCreated-->父 created --> 父beforeMounted --> 子beforeCreated-->子 created --> 子beforeMounted --> 子mounted --> 父mounted

更新阶段

父 beforeUpdate --> 子 beforeUpdate --> 子 updated --> 父 updated

销毁阶段

父 beforeDestroy --> 子 beforeDestroy --> 子 destroyed--> 父 destroyed

二：v-on的常用修饰符

　　.stop 该修饰符将阻止事件向上冒泡。同理于调用 event.stopPropagation() 方法

　　.prevent 该修饰符会阻止当前事件的默认行为。同理于调用 event.preventDefault() 方法

　　.self 该指令只当事件是从事件绑定的元素本身触发时才触发回调

　　.once 该修饰符表示绑定的事件只会被触发一次

三： v-for 中key的作用

　　当Vue用 v-for 正在更新已渲染过的元素列表时，它默认用“就地复用”策略。如果数据项的顺序被改变，Vue将不是移动DOM元素来匹配数据项的改变，而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。 为了给Vue一个提示，以便它能跟踪每个节点的身份，从而重用和重新排序现有元素，你需要为每项提供一个唯一 key 属性。key属性的类型只能为 string或者number类型。

　　key 的特殊属性主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用 key，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用 key，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。