el-col添加点击事件方法

项目场景：

2022年3月 知识产权模块 导航栏添加点击事件

---

问题描述

el-col组件的点击事件添加无效

---

原因分析：

使用.native之后父组件可以像处理原生的DOM事件一样,通过 v-on 监听子组件实例的任意事件。

不加.natvie，会认为监听的是来自子组件自定义的事件，然而子组件内也没有使用$emit()来将子组件的触发事件抛出，因此callback()方法没有执行。

---

解决方案：

使用v-on:click.native="function()"或@click=”function()”添加点击事件

方法1：不改变子组件页面的话，父组件写法

<el-col @click.native="callback"></el-col>

方法2：
父组件

<template>
<div>
	<el-row type="flex">
	  <el-col @click="callback"></el-col>
	</el-row>
</div>
</template>
<script>
methods: {
	callback() {}
}
</script> 

子组件

<template>
	<div>
		<button @click='handleClick'></button>
	</div>
</template>
<script>
methods: {
	handleClick() {
		this.$emit('click')
	}
}
</script>