vue中.async，.lazy，.passive等一些常用修饰符

1.修饰符.sync

  由于保持数据的单向性，从父组件传到子组件的数据，子组件如果修改了项目还可以运行浏览器上会报错，加上.sync后子组件内部改变props属性值并更新到父组件中

<child :name.sync="name"></child>  // 父组件

// 子组件事件
changePropsInChild(){
      this.$emit('update:name', 'I am from child');
}

:name.sync就是:name="name" @update:name="name = $event"的缩写

2.修饰符.lazy

 v-model双向数据绑定，输入框输入内容时视图就更新了，如果想要输入完所有东西，光标离开才更新视图

<input type="text" v-model.lazy="value">

3.修饰符.passive

在监听元素滚动事件的时候，会一直触发onscroll事件，在pc端是没啥问题的，但是在移动端，会让我们的网页变卡，因此我们使用这个修饰符的时候，相当于给onscroll事件整了一个.lazy修饰符

<div v-on:scroll.passive="onScroll">...</div>

4.修饰符.native

这个修饰符只能是操作在组件上，把一个vue组件转化为一个普通的HTML标签，如果是操作在普通HTML标签上会失效

<My-component @click.native="shout(3)"></My-component>