el-row的@click.stop并没有阻止事件冒泡，还是会触发外层div的点击事件

当点击一个元素时，会进行冒泡，一直触发到父元素。可以通过给click加stop来阻止事件冒泡，如：@click.stop=“search_maf_version(version)”，但是发现给el-row加上@click.stop并没有生效，还是会触发外部的点击事件
我的问题代码为：

<div @click="search_maf(item)">
     <el-row v-for="version in item.version_list" :key="version.id" :class="{ 'blue-background': versionItem === version }" @click.stop="search_maf_version(version)">
              {{ version.version }}
     </el-row>
</div>

当我点击el-row时，还是会触发search_maf(item)，而不会触发search_maf_version(version)
原因：在使用 Vue.js 框架的 Element UI 库中，对于一些组件，如 el-row ，可能不能直接通过在其上添加 @click 来绑定原生的 click 事件，因为这些组件可能没有实现 click 事件的派发。
解决：在 el-row 组件内部再套一个 native HTML 元素（如 div），然后在该元素上绑定 click 事件

<div @click="search_maf(item)">
	<el-row v-for="version in item.version_list" :key="version.id" :class="{ 'blue-background': versionItem === version }">
	    <div @click.stop="search_maf_version(version)">
	        {{ version.version }}
	    </div>
	</el-row>
</div>

这样就可以只触发search_maf_version(version)，而不会触发search_maf(item)啦，大功告成！