复习最后一天

10、v-if与v-show的区别： v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 v-if 也是惰性的：如果在初始渲染时条件为假，则什么也不做；—直到条件第一次变为真时，才会开始渲染条件块。 相比之下，v-show 就简单得多；—不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 进行切换。 一般来说，v-if 有更高的切换开销，而 v-show 有更高的初始渲染开销。因此，如果需要非常频繁地切换，则使用 v-show 较好；如果在运行时条件很少改变，则使用 v-if 较好。

11、各种通信： 父子通信： 子组件通过props接受父组件传递过来的数据 【注】prop是单向数据流，当父组件数据变化时，将传递给子组件，但是翻过爱就不会，并且没吃父组件更新时，子组件props接受的都会是最新数据 子父通信： （1）通过传递方法实现 1.父组件定义自己的数据 2.父组件需要写一个更改自身数据的方法 3.在调用子组件的时候，父组件需要将更改自身数据的方法通过属性的方式传递给子组件 4.子组件通过props接受父组件传递的方法，并且触发这个方法 （2）通过自定义事件实现 1.父组件定义自己的数据 2.父组件需要写一个更改自身数据的方法 3.在调用子组件的时候，给其绑定一个自定义事件，这个时间触发父组件修改自身数据的方法 4.在子组件上写一个方法触发自己身上的自定义事件，this.$emit(自定义事件的名字,参数)（3）关系链：$parent $children（4）ref链1.在调用子组件的时候通过ref标记子组件2.父组件发法可以通过this.$refs.xxx找到子组件直接修改相应数据 兄弟通信 （1）关系链 （2）ref链：必须先通过$parent找到父节点再通过$refs找到子组件 （3）bus事件总线 1.创建一个公共的vue实例对象 2.绑定一个事件等待触发 两个参数（“自定义事件名”，“执行的回调函数”） 3.通过$on来事件绑定4.通过$emit来触发自定义事件 12、生命周期的钩子函数： （1）初始化阶段： beforeCreated： 这个钩子函数初始化时执行、但是获取不到数据，并且也获取不到真是DOM，基本没用 Created： 可以访问到数据了、但是真实DOM还没有渲染出来； 在这个钩子函数里面，可以进行相关初始化事件的绑定、发送ajax请求 当组件没有挂载完毕之前、更改数据的话、是不会触发运行钩子函数的 beforeMount： 还没渲染出来dom但是马上了，和created基本一样 (render)： 生成好虚拟dom，然后内部通过render函数对应的el进行替换，做一个虚拟化的虚拟dom渲染成真是dom的过程 Mounted： 数据挂载完毕、真是dom也渲染出来了； 这个钩子函数内部可以做一些实例化相关的操作 （2）运行阶段： beforeUpdate： 这个钩子函数初始化时不会执行； 当组件挂载完毕、且数据发生改变时，才会立即执行 这个钩子函数获取的真是dom是数据更新前的真实dom Updated： 这个钩子函数获取的dom的内容是数据更新之后的内容 生成新的虚拟dom、新的虚拟dom与旧的虚拟dom进行对比，对比差异之后就会渲染真实dom 这个钩子函数内部就可以获取到因diff算法比较差异得出来的真实dom渲染了 （3）销毁阶段： beforeDestroy： 组件销毁前执行； 可以做一些善后操作、可以清楚初始化事件、定时器相关的东西 Destroyed： 组件销毁是执行、watch数据劫持等功能已经完全消失 13、自定义指令的钩子函数： （1）钩子函数 bind：只调用一次，指令第一次绑定到元素时调用。用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。 inserted：被绑定元素插入父节点时调用（父节点存在即可调用）。 update：所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前。指令的值可能发生了改变，也可能没有。但是你可以通过比较更新前后的值来忽略不必要的模板更新 componentUpdated：指令所在组件的 VNode 及其子 VNode 全部更新后调用。 unbind：只调用一次， 指令与元素解绑时调用。 （2）钩子函数参数（前两个重点后面无所谓） el：指令所绑定的元素，可以用来直接操作 DOM 。 binding：一个对象，包含以下属性 name：指令名，不包含v-的前缀； value：指令的绑定值；例如：v-my-directive=“1+1”，value的值是2； oldValue：指令绑定的前一个值，仅在update和componentUpdated钩子函数中可用，无论值是否改变都可用； expression：绑定值的字符串形式；例如：v-my-directive=“1+1”，expression的值是’1+1’； arg：传给指令的参数；例如：v-my-directive:foo，arg的值为 ‘foo’； modifiers：一个包含修饰符的对象；例如：v-my-directive.a.b，modifiers的值为{‘a’:true,‘b’:true} vnode：Vue编译的生成虚拟节点； oldVnode：上一次的虚拟节点，仅在update和componentUpdated钩子函数中可用。