收藏
回答

map组件marker custom-callout中使用cover-image不显示

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug cover-image 微信安卓客户端 7.0.18 2.12.2

<cover-view slot='callout'>

      <cover-view wx:for="{{markers}}wx:key="idwx:for-index="idxwx:for-item="marker">

        <cover-view marker-id="{{marker.id}}">

          <cover-view wx:if="{{curClusterItem.markerID == marker.id}}">

            <cover-view wx:if="{{curClusterItem.itemType == ClusterItemType.PHOTO}}">

              <cover-image class="callout-photomode="aspectFitsrc="{{curClusterItem.detail.url}}" />

              <cover-view>'{{curClusterItem.detail.url}}'cover-view>

            cover-view>

          cover-view>

        cover-view>

      cover-view>

    cover-view>

cover-image不显示,但同级的cover-view显示正常

回答关注问题邀请回答
收藏

16 个回答

  • 杨杨得亿
    杨杨得亿
    2024-05-01

    四年了,官方也没人来回答一下这个问题,这个社区就是留着给人看问题而不是解决问题的。

    经过多方验证,我最后得到的一个结果就是,cover-image无法响应数据。就是说在加载完cover-image的渲染之后,网络图片才加载完成的话,就会出现不显示图片的问题。

    我的解决方案是通过wx.downloadFile来下载完成资源之后,再去更新cover-image。

    loadImage(imageSrc) {
      return new Promise((resovle, rejected) => {
        wx.downloadFile({
          url: imageSrc,
          successfunction(res{
            if (res.statusCode !== 200) rejected('加载网络图片失败');
            resovle(res.tempFilePath)
          },
          failfunction(error{
            rejected(error)
          }
        })
      })
    }
    


    2024-05-01
    有用 3
    回复
  • Eva
    Eva
    2024-12-18

    队友们,我好像找到解决方法,我在cover-image 加一个wx:key 解决了

      <cover-image data-index='{{index}}'  class="iconstyle="width:{{item.width}}rpx;height:{{item.height}}rpx;src="{{item.cover_img}}"  bindload="{{!item.imgend?'loadImage':''}}" wx:key='{{item.imgend}}' wx:if="{{item.loading}}"></cover-image>


    2024-12-18
    有用 2
    回复 1
    • hybs
      hybs
      02-10
      有用。不过我以前的项目没绑key也可以显示,不知道现在为什么不行
      02-10
      回复
  • João
    João
    2025-10-21

    2025年10月了, 这个问题还是没有得到解决。

    我对小程序的预期是高于小程序的表现的。

    2025-10-21
    有用 1
    回复 2
    • 我叫卜前程
      我叫卜前程
      2025-10-24
      有解决方法了吗
      2025-10-24
      回复
    • A小懒猪💎
      A小懒猪💎
      2025-12-05
      2025-12-05
      回复
  • 玲玲
    玲玲
    2021-12-27


    解决了吗?我用uni-app 开发H5。也遇到这个问题,在map custom-callout中使用cover-image,图片不显示

    2021-12-27
    有用 1
    回复
  • Cjiang
    Cjiang
    2020-09-07

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),提供下具体的机型,微信版本号,系统版本号。

    2020-09-07
    有用 1
    回复 12
    查看更多(7)
  • 柳
    发表于移动端
    03-23
    你好
    03-23
    有用
    回复
  • 唯
    01-20

    遇到同样的问题,但是我却误打误撞出来了,我在cover-view加了个动态class,本来想搞点击添加选中样式,却发现,点击的时候样式没出来,图片却出来了。于是,我就加了个:class="{'refresh': isRefresh}",生成marker后,执行setTimeout(()=>{this.isRefresh = true},500),图片都会加载出来,感觉应该是因为动态设置了class,导致元素重新渲染了,致使图片出现了。

    01-20
    有用
    回复
  • 海涛
    海涛
    2025-07-16

    先给cover-iamge v-show=false, 然后监听加载成功事件,再显示出来。麻烦点,但是有效

    2025-07-16
    有用
    回复 1
    • 我叫卜前程
      我叫卜前程
      2025-10-24
      没有用的 图片加载不出来也是会触发加载成功事件的
      2025-10-24
      回复
  • Rendering
    Rendering
    2024-12-13

    2024年12月了,这个问题还是没解决。

    2024-12-13
    有用
    回复
  • Zzzz...
    Zzzz...
    2024-11-01

    2024年11月了,这个问题还是没解决。

    2024-11-01
    有用
    回复

正在加载...

登录 后发表内容
问题标签