vue的生命周期有几个，vue一共有几个生命周期

vue生命周期的执行顺序是怎样的呢？

下图展示了实例的生命周期。你不需要立马弄明白所有的东西，不过随着你的不断学习和使用，它的参考价值会越来越高。

js基础很好 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:‘

• {{p1}}

'})

vue常用实例方法和属性：data/$data、methods/$methods、$el、computed(计算属性)、$watch、$set、$event、$emit...

如果需要更新的属性需要缓存，则使用计算属性的方式，否则可以使用methods里的方法来更新属性（methods里的方法每次重新渲染都会执行）

计算属性默认提供了getter，你还可以给它设置setter

当你数据变化是异步或者开销较大时，可以使用watch侦听器来响应数据的变化

v-bind:class的值可以是一个对象，可实现类似react中classnames模块的功能

自定义组件上的class会被渲染拼接到template的根节点的class属性上（自定义组件上可使用v-bind:class来做class的判断显示逻辑）

v-bind:style可以用来绑定内联样式，这个内联样式的值可以由一个对象来定义（类似cssinjs的模式）,且可以被定义为数组(多个样式对象)

v-bind:style可以使用多重值的形式：

v-if/v-else/v-else-if的时候，可以用key来管理可复用的元素

v-if是’真正’的渲染，它会确保在切换条件过程中条件块内的元素的事件监听器和子组件适时的销毁和重建

v-if是惰性的，初始为假，什么也不做，直到为真的时候才渲染元素

v-show总是渲染元素，只是简单的进行切换

v-if的切换开销大，v-show则是初始渲染开销大，频繁切换使用v-show，运行时经常改变则使用v-if

v-if和v-for一起使用时，v-for的优先级更高

v-for可遍历数组，第二个参数是索引

v-for可遍历对象，第二个参数是key，第三个参数是索引

v-for和搭配可减少渲染次数

v-for和自定义组件使用时，需要使用props来传递值

尽可能的为遍历子元素加上key，获得渲染优化

数组变异方法：push/pop/unshift/shift/splice/sort/reverse改变原始数组

数组非变异方法：filter/concat/slice不改变原始数组，总是返回新数组

Vue不能检测到数组索引赋值（使用vm.$set解决）和修改length长度赋值(使用splice解决)的情况

Vue不能检测对象属性的添加和删除(使用vm.$set或Object.assign)

is=“todo-item”这种属性的写法比较适合DOM模板

事件修饰符，它们可串联使用：.stop、.prevent、.capture、.self、.once、.passive(尤其适合移动端)

.passive不用同时和.prevent使用，后者会被忽略

按键修饰符:.enter、.tab、.delete、.esc、.space、.up、.down、.left、.right

系统按键修饰符:.ctrl、.alt、.shift、.meta(⌘|⊞|◆)、.exact(允许精确控制系统修饰符组合键触发)

鼠标修饰符：.left、.right、.middle

v-model会忽略表单元素的value、checked、selected，仅仅使用实例中的数据作为数据源

表单事件修饰符：.lazy、.number、.trim

组件是可复用的vue实例，具有vue实例大多数属性和方法

组件可复用，每个组件有独立的空间

组件上的data必须是一个函数，这样做避免影响了其他组件

通过Vue.component()全局注册的组件可在其被注册后的任何通过newVue()创建的实例所使用，包含其组件树中的所有组件

通过插槽分发内容(其实就是类似于react的children)

动态组件配合属性is来实现

解析DOM模板时需要注意下可能会有不生效的情况，需要使用is来传递组件