cover-image绑定事件无效

最新推荐文章于 2024-07-31 18:23:32 发布

卡卡西不卡

最新推荐文章于 2024-07-31 18:23:32 发布

阅读量941

点赞数 1

CC 4.0 BY-SA版权

分类专栏：应知应会文章标签：小程序

本文链接：https://blog.csdn.net/hahaha113461/article/details/116716790

应知应会专栏收录该内容

6 篇文章

订阅专栏

本文解决了小程序中自定义导航栏返回按钮在某些安卓设备上无法点击的问题。原因是cover-view和cover-image组件导致的层级冲突，通过调整DOM顺序解决了标题覆盖返回按钮的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

小程序自定义导航栏在左上角返回按钮绑定返回事件，结果在有些安卓机上出现了无法点击的bug，原因是我为了阻止canvas刮奖时用户滑动页面导致canvas层级覆盖导航栏，所以导航栏使用了cover-view和cover-image组件重写的。结果就出现了点击事件无效。因为cover-系列的组件层级是按照节点顺序自动增加权重的。正常编写代码的时候标题的节点必然在在返回的节点之后，所以标题的节点覆盖了返回按钮的节点。查到原因解决就容易了，把返回按钮和标题位置互换下即可。

<cover-view class="navbar">
		<cover-image class="navbarBg" src="导航栏底部背景图"></cover-image>
		<cover-view class="statusbar" style="height:{{statusBarHeight}}px"></cover-view>
		<cover-view class="titlebar">
			<cover-view class="navtitle">标题标题</cover-view>
			<cover-image class="l_arrow" src="返回按钮图" bindtap="goBack"></cover-image>
		</cover-view>
	</cover-view>