如何使用修饰符 .native 和 .sync

.native 事件修饰符是在父组件中给子组件绑定一个原生的事件,就把子组件变成了普通的HTML标签

接下来,来演示一下上面的结论:

两个组件,父组件和子组件,父组件中代码

<div><Son @click="hClick"/></div>
import Son from 'xxxxx.vue'
export default {
components:{Son}
methods:{
hClick(){
console.log('子组件被点击了')
}

}
}

我们可能会有这种想法,就是说只要给标签绑定@click事件就可以被点击

上面代码的结论是,点击没有反应哦,那怎样我才能点击的时候,有输出呢? 

//这是写入son组件的代码
<template>
<div @click="$emit('click')"></div>
</template>

 通过子传父的方式我们就可以实现点击事件了,那有没有比较简单的方式呢

当然,我们可以给标签绑定 @click.native就可以触发click事件啦

结论就是: 如果你给标签绑定了点击事件,@click, 发现点击触发不了,这时候 @click后面加 .native就可以触发这个点击事件了

.sync