首先，我们知道，vue中事件分两种
一种是原生DOM事件，也就是加在原生DOM节点上的事件，如：click blur input等
<button @click="handler">原生DOM事件</button>methods: {handler(){console.log('原生DOM事件');}}
另一种是自定义事件，如加在Vue组件上的事件，如：父子组件通信
子组件内
<button @click="$emit('eventOne','eventOne的自定义事件')">Event1组件</button>
父组件内
<event-one @eventOne='handler1'></event-one>methods: {handler1(value){console.log(value);}}
但是当我们想在Vue组件上添加原生的DOM事件可以么？如这样
<event-two @click='handler2'></event-two>
经过测试发现是不可以的，因为当事件添加到Vue组件上时，会变成自定义事件，如果想要出发事件的回掉函数，则必须子组件内的$emit调用才可以。
那么该如何给组件添加DOM事件呢？
Vue提供了一个修饰符 native，他可以直接给组件绑定事件监听
<event-two @click.native='handler2'></event-two>methods: {handler2(){console.log('我是EventTwo组件');}}
添加之后测试发现，事件被触发了
那么native是如何实现给组件添加事件的呢？
我们对比下面两个组件在最后生成的页面中有哪些不同点
<event-two @click='handler2'></event-two><event-two @click.native='handler2'></event-two>
看看有什么区别
发现，添加了native修饰符的组件其实就是在组件的根标签上添加了一个事件监听
结论:
1. native修饰符可以让父组件接收到原生事件, 否则只能接收自定义事件(通过子组件$emit触发)
2. native修饰符只能用在组件上, 不能用在原生标签上
