vue之native

当你在父组件中的子组件上绑定一个vue原生事件，如果不加上.native，事件是不生效的。
native是必须要加在根组件上的，如果加在普通HTML标签上是不生效的。

子组件：

<div >
	<button type="button">我是按钮</button>
</div>

父组件：

<template>
	<div >
		<div class="blue" @click="outer(1)"></div>
		<div class="grey" @click.native="outer(2)"></div><br>
		<TestComp @click="outer(3)"></TestComp><br>
		<TestComp @click.native="outer(4)"></TestComp>
	</div>
</template>

<script>
	import TestComp from '../components/testcomp.vue'
	export default{
		components:{ TestComp },
		methods:{
			outer(msg){
				console.log(`我是第${msg}个`);
			},
					
		}
	}
</script>

<style>
	.blue{
		background-color: #00E0E0;
		height: 33px;
	}
	.grey{
		background-color: #666666;
		height: 33px;
		margin-top: 9px;
	}
</style>

结果：

如上所示：

第二个不生效是因为普通标签上加native，事件是不生效的。
第三个不生效是因为组件上的事件要加native，否则是不生效的。