<map class="map" latitude="30.251787999999998" longitude="120.21538799999996" :markers="points"
@markertap="onMarkerTap" @callouttap="onMarkerTap">
<!-- 自定义callout模板 -->
<cover-view slot="callout">
<cover-view v-for="(point, index) in points" :key="index" class="custom-callout"
:marker-id="point.id">
<cover-image src='/static/jianbianBackground.png' class="callout-img"></cover-image>
<cover-view class="callout-icon">
<cover-image src="/static/pijiu.png" style="width: 100%;height: 48rpx;"></cover-image>
</cover-view>
<cover-view class="callout-content">
<cover-view class="callout-title">{{ point.title }}</cover-view>
<cover-view class="callout-location">{{ point.description }}</cover-view>
</cover-view>
<cover-view class="callout-icon">
<cover-image src="/static/right.png" style="width: 100%;height: 48rpx;"></cover-image>
</cover-view>
</cover-view>
</cover-view>
</map> 
5***@qq.com
- 发布：2025-10-15 23:14
- 更新：2025-10-16 10:54
- 阅读：70
产品分类： uniapp/小程序/微信
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 11
HBuilderX类型： 正式
HBuilderX版本号： 4.66
第三方开发者工具版本号： 1.06
基础库版本号： 3.10.0
项目创建方式： HBuilderX
示例代码：
操作步骤：
<map class="map" latitude="30.251787999999998" longitude="120.21538799999996" :markers="points"
@markertap="onMarkerTap" @callouttap="onMarkerTap">
<!-- 自定义callout模板 -->
<cover-view slot="callout">
<cover-view v-for="(point, index) in points" :key="index" class="custom-callout"
:marker-id="point.id">
<cover-image src='/static/jianbianBackground.png' class="callout-img"></cover-image>
<cover-view class="callout-icon">
<cover-image src="/static/pijiu.png" style="width: 100%;height: 48rpx;"></cover-image>
</cover-view>
<cover-view class="callout-content">
<cover-view class="callout-title">{{ point.title }}</cover-view>
<cover-view class="callout-location">{{ point.description }}</cover-view>
</cover-view>
<cover-view class="callout-icon">
<cover-image src="/static/right.png" style="width: 100%;height: 48rpx;"></cover-image>
</cover-view>
</cover-view>
</cover-view>
</map>
<map class="map" latitude="30.251787999999998" longitude="120.21538799999996" :markers="points"
@markertap="onMarkerTap" @callouttap="onMarkerTap">
<!-- 自定义callout模板 -->
<cover-view slot="callout">
<cover-view v-for="(point, index) in points" :key="index" class="custom-callout"
:marker-id="point.id">
<cover-image src='/static/jianbianBackground.png' class="callout-img"></cover-image>
<cover-view class="callout-icon">
<cover-image src="/static/pijiu.png" style="width: 100%;height: 48rpx;"></cover-image>
</cover-view>
<cover-view class="callout-content">
<cover-view class="callout-title">{{ point.title }}</cover-view>
<cover-view class="callout-location">{{ point.description }}</cover-view>
</cover-view>
<cover-view class="callout-icon">
<cover-image src="/static/right.png" style="width: 100%;height: 48rpx;"></cover-image>
</cover-view>
</cover-view>
</cover-view>
</map> 预期结果：
markers不应该挡住callout
markers不应该挡住callout
实际结果：
markers不应该挡住callout
markers不应该挡住callout
bug描述：
MAP组件的markers组件会挡住上面的自定义callout，在微信原生语言就不会有这样的问题
5***@qq.com (作者)
有
2025-10-16 13:01
5***@qq.com (作者)
那我去官方反馈一下
2025-10-16 13:01
DCloud_UNI_JBB
回复 5***@qq.com: 嗯嗯
2025-10-16 14:01