Vue 中给组件绑定原生事件

绑定原生事件<div id=“root”> <child @click=“handleClick”></child></div>Vue.component(‘child’,{ template:’<div @click=“handleChildClick”>content</div>’, methods: { handleChildClick(){ alert(‘click child’) this.$emit(‘click’) } }})let vm = new Vue({ el: ‘#root’, methods: { handleClick(){ alert(‘click’) } }})当我给一个组件绑定一个事件的时候，实际上这个事件绑定的是自定义的事件，也就是你真正的鼠标点击触发的事件，并不是我绑定的click事件，如果想触发自定义的click事件，在子组件里对元素进行事件绑定，这个事件才是真正的原生事件。在元素上绑定的事件，监听的是原生事件，在组件上绑定的事件，监听的是自定义事件，需要用this.$emit()来触发。在开发的过程中这样写有点太麻烦，假如我有这样的需求，我就想在子组件上监听原生的事件，该怎么做呢？<div id=“root”> <child @click.native=“handleClick”></child> //native 是事件修饰符</div>Vue.component(‘child’,{ template:’<div>content</div>’,})let vm = new Vue({ el: ‘#root’, methods: { handleClick(){ alert(‘click’) } }})这个时候，在组件上面做事件的监听，并不是自定义事件，而是一个原生的click事件，只要在事件绑定的后面加上一个native这样的事件修饰符就可以了。