• 列表渲染

    • 数组：（item，index） of arr
    • 对象:(val,key,index) of object
    • 实际使用时常用[{},{}] (数组嵌套对象)

  • key的管理:(vue v-for 下key值的作用)

  • 在v-for使用v-bind:key绑定key,会使虚拟DOM记录节点的身份，在操作数组等元素进行变动时，DOM也会进行变动，在使用key值的情况下，不会让DOM元素排序产生混乱

    如果只是进行固定的列表渲染，可以不适用key获得vue本身的性能提升，

    如果要进行数组的呢过数据的变化来改变DOM元素时，建议加上唯一的key值

  • 在vue实例化对象外去操作data的数组或对象：能够在vue实例化对象内修改数据的情况下，不要在外部修改

  • 如果在vue实例化外部操作vue中的数据,视图没发生更新,可以使用什么方法去解决?

    • 当在实例化外插入vue实例化中的数据时，不能直接加入，可以使用数组变异方法并处罚视图的更新

      下为数组变异方法

    • push()//在尾部插入

  • pop()//在尾部删除

  • shift()//在头部删除

  • unshift()//在头部插入

  • splice()//增删改

  • sort()//排序

  • reverse()//反转数组

  • 使用Vue.set(数组，下标，追加的内容)
    使用vm.$.set(数组，下标，追加的内容)

    对象： Vue.set(对象,key,val) vm.$set (对象,key,val)

    合并对象的方法，可以同时添加多个属性

  • v-for和v-if<mark>在同一DOM节点去使用时</mark>，v-for优先级始终大于if，不论条件是否满足，都会将数据进行遍历，然后再进行v-if条件的判断，所以如果有v-if条件的隐藏，会消耗性能，不推荐在同一DOM节点上使用v-if和v-for

    要使用其他方法去代替，可以使用filter先过滤后再去遍历

    如果v-if的DOM节点包含v-for的DOM节点时，，v-if的优先级大于v-for

  • v-for可以嵌套使用

  • 在组件调用处使用v-for:遍历多次组件上，必须加key值

     <Mycomponent v-for="item of arr" :key="item"></Mycomponent>

    <mark>当在组件上使用 v-for 时，key 现在是必须的</mark>

  • 事件修饰符

  • stop阻止冒泡

  • prevent阻止默认行为

  • once只让事件执行一次

  • self事件只作用在元素本身触发，不作用在子元素上触发

  • passive:许多浏览器在执行事件时，都会去默认的询问是否有阻止事件，默认行为

    的方法，加上passive修饰符后，告诉浏览器，不用去询问是否有阻止事件默认行为

    (preventDefault)这个事件中没有，事件修饰符可进行链式操作，passive和prevent不能合并

    使用，浏览器会抛出警告

  • capture把冒泡事件改为捕获事件

<mark>事件修饰符可以进行链式操作:@click.prevent.once</mark>