retrocode
retrocode
  • 发布:2020-06-18 16:54
  • 更新:2021-07-11 10:15
  • 阅读:1721

nvue下 touchstart拦截掉了子元素button的click事件,有什么防止穿透的方法吗?

分类:nvue

我使用nvue做了一个仿QQ的侧滑栏,父元素上添加了touchstart来监听触摸事件,然后在子元素中写主界面,
目前发现父元素的touchstart事件会拦截掉子元素的click事件,导致点击失效,
现在是nvue无法获取dom信息进行判断,我尝试了子元素也用touchstart事件,但这会导致点击和滑动事件同时触发.
有什么好的解决办法吗?

侧滑组件

	<view class="container">  
		<view class="menu">  
			<view class="item_container"><text class="item">Menu1</text></view>  
			<view class="item_container"><text class="item">Menu2</text></view>  
			<view class="item_container"><text class="item">Menu3</text></view>  
			<view class="item_container"><text class="item">Menu4</text></view>  
			<view class="item_container"><text class="item">Menu5</text></view>  
		</view>  
		<view class="main" id="main" ref="main" @touchstart="onTouchStart"><slot></slot></view>  
	</view>

主界面

	<SliderMenu ref="menue" :left-width="250" timeFunction="easeOutBounce">  
		<view class="title">uniCloud 基础示例</view>  
			<view class="tips">  
			<view>1.在cloudfunctions目录右键创建并关联服务空间</view>  
			<view>2.在cloudfunctions目录内db_init.json上右键初始化云数据库</view>  
			<view>3.在cloudfunctions目录右键选择“上传所有云函数”</view>  
			<view>开始愉快的体验uniCloud吧!</view>  
		</view>  
		<view class="btn-list">  
			<button class="button" type="primary" @click="add">新增一条数据</button>  
			<button class="button" type="primary" @click="remove">删除一条数据</button>  
			<button class="button" type="primary" @click="update">修改数据</button>  
			<button class="button" type="primary" @click="get">查询前10条数据</button>  
			<button class="button" type="primary" @click="useCommon">使用公用模块</button>  
			<button class="button" type="primary" @click="upload">上传文件</button>  
		</view>  
	</SliderMenu>
2020-06-18 16:54 负责人:无 分享
已邀请:
菜狗

菜狗

请问解决了吗

2***@qq.com

2***@qq.com

我遇到的问题是,子元素添加了touchstart会拦截父元素的click,而子元素的click.stop会和父元素的click一起触发,坑死爹了

该问题目前已经被锁定, 无法添加新回复