vue3 阻止事件冒泡，子元素.stop 失效

一、父元素调用子元素，子元素自身带有点击事件

开始跟目录阻止冒泡事件如下：点击后发现并不能阻止冒泡
1、跟目录

<div class="root" @click="onDetail">
<div class="chid-content">
<child  @onChange.stop="onChange"/>
</div>
</div>

2、子元素

<div class="child">
<childC @change="onChange"/>
</div>

二、解决办法：在子元素的容器上添加.stop

修改如下：
1、跟目录

<div class="chid-content" @click.stop></div>

<div class="root" @click="onDetail">
<div class="chid-content" @click.stop>
<child  @onChange="onChange"/>
</div>
</div>