Vue的各个知识点收集

知识点：

• vue的生命周期： beforeCreate/created、beforeMount/mounted、beforeUpdate/updated、beforeDestory/destoryed
• vue常用指令： v-for、v-bind（缩写形式:prop）、v-on(缩写形式@click=’sss’)、v-if/v-else/v-else-if、v-model、v-once、v-html、v-show…
• vue自定义组件：Vue.component(‘componentName’,{ props:[‘p1’,’p2’], template: ‘< li >{{ p1 }}< /li >’ })\
• vue常用实例方法和属性: data/$data、methods/$methods、$el、computed(计算属性)、$watch、$set、$event、$emit…
• 如果需要更新的属性需要缓存，则使用计算属性的方式，否则可以使用methods里的方法来更新属性（methods里的方法每次重新渲染都会执行）
• 计算属性默认提供了getter，你还可以给它设置setter
• 当你数据变化是异步或者开销较大时，可以使用watch侦听器来响应数据的变化
• v-model会忽略表单元素的value、checked、selected，仅仅使用实例中的数据作为数据源
• 通过Vue.component()全局注册的组件可在其被注册后的任何通过new Vue()创建的实例所使用，包含其组件树中的所有组件
• 通过插槽分发内容(其实就是类似于react的children)
• 动态组件配合属性is来实现
• is=“todo-item”这种属性的写法比较适合DOM模板
• 数组非变异方法：filter/concat/slice 不改变原始数组，总是返回新数组
• 数组变异方法：push/pop/unshift/shift/splice/sort/reverse改变原始数组
• v-bind:style可以用来绑定内联样式，这个内联样式的值可以由一个对象来定义（类似css in js的模式）,且可以被定义为数组(多个样式对象)
• v-bind:style可以使用多重值的形式：<div :style=“display:[‘-webkit-box’,’-ms-flexbox’, ‘flex’]">< /div>
• v-if/v-else/v-else-if的时候，可以用key来管理可复用的元素
• v-if是’真正’的渲染，它会确保在切换条件过程中条件块内的元素的事件监听器和子组件适时的销毁和重建
• v-if和v-for一起使用时，v-for的优先级更高
• v-for可遍历数组，第二个参数是索引