Uniapp 地图标点 点击事件 markertap /bindmarkertap 不生效
先来说说 uniapp 的使用感想:
刚开始使用 uniapp 不久,使用上来说与 vue3 没有多大区别,setup 语法感觉非常舒适,使用起来方便、简易,相对于使用 flutter 、原生来说,对于小型企业来说真的是属于便利的一个跨平台框架了。
国内的现状,开发成本降低、适配平台需求较广,例如小程序 (支付宝、微信、抖音等等)、APP (android、ios)以及遥遥领先 harmony os。目前官方有说明已经大部分适配 鸿蒙,这个框架还是挺强的。
对于这种适配层面较广的框架,难免就会出现很多 BUG、兼容性适配。

今天遇到的问题:

  • markertap 事件不生效
  • 使用:markers 直接赋值在 map 微信开发工具正常显示、真机运行不显示
  • 使用:covers 直接赋值在 map 微信开发工具不显示、真机运行显示正常
    场景:
    <map show-location
    id=“map”
    :latitude=“latitude”
    :markers=“showMarker” :covers=“showMarker”
    :scale=“scale” :longitude=“longitude”
    :polyline=“polyines” name=“index-map”
    style=“width: 100%;” :style="{height : ${mapHeight}px }"
    @tap=“onMapTap” @markertap=“onMarkerTap”>

遇到了 marker 不显示,后面将 markers 和 covers 都赋值在 map 组件上。最后都能看到了。于是开始解决 markertap 不生效的问题。

尝试:

  1. 使用 @markertap 绑定事件, 在微信开发者工具中可以正常运行,但是真机调试点击不了,不能正常响应
  2. 使用 bindmarkertap 进行绑定,随后在微信开发者工具报错,"In Component Unabled to find onMarkerTap method to handle markertap."

最终解决方案:
<map show-location
id=“map”
:latitude=“latitude”
:scale=“scale” :longitude=“longitude”
:polyline=“polyines” name=“index-map”
style=“width: 100%;” :style="{height : ${mapHeight}px }"
@tap=“onMapTap” @markertap=“onMarkerTap”>

最终的解决方案就是将 marker 数据通过代码 手动添加到 map, 事件绑定仍然采用 @markertap 的形式去绑定。
原因暂时未知:有可能是 uniapp 在适配层没有去兼容 ,响应式 marker 数据没有绑定被点击的事件。

更新于 阅读次数

请我喝[茶]~( ̄▽ ̄)~*

Jone Loucy 微信支付

微信支付

Jone Loucy 支付宝

支付宝

Jone Loucy 贝宝

贝宝