vue中transition内部元素click/touch事件无效
我遇到这样一个问题:下图中标记部分点击无效。如果没加transition是可以的,我加transition是为了切换的功能。
图中两个地方是vant组件。
大概代码:
<transition :name="direction">
<div v-if="show" class="content-wrapper">
<div class="rc-answer">
<van-radio-group
v-model="result.res"
direction="horizontal"
checked-color="#FFB500"
icon-size="30"
@change="handleAnswer"
>
<van-radio name="1">是</van-radio>
<van-radio name="0">否</van-radio>
</van-radio-group>
</div>
<div class="rc-more">
<div class="rcm-wrapper">
<div class="remark">
<textarea v-model="result.remark" placeholder="添加备注..."></textarea>
</div>
<div class="uploader">
<van-uploader
v-model="fileList"
:before-read="beforeRead"
:after-read="afterRead"
:max-count="3"
multiple
>
<div class="handler">
<svg-icon icon-name="iconplus"></svg-icon>
</div>
</van-uploader>
</div>
</div>
</div>
</div>
</transition>
我也尝试在其他dom上加touchstart/click事件,均无效。
这是什么原因导致的呢?
问题既然发出来了,我就不删除了,我的原因是我在transition的直接父元素 添加了touchstart.prevent.stop = "xxx",所以导致事件无法向内部传递(捕获阶段被拦截),也就里面的事件失效了,把prevent去掉即可。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论