CoverView

cover-view

覆盖在原生组件之上的文本视图。可覆盖的原生组件包括map，暂时不支持嵌套。

属性名类型默认值描述最低版本
onTapEventHandle点击事件回调1.9.0

cover-image

覆盖在原生组件之上的图片视图，可覆盖的原生组件同cover-view，暂不支持嵌套。

属性名类型默认值描述最低版本
srcString图片地址，支持的地址格式同image一致1.9.0
onTapEventHandle点击事件回调1.9.0

示例代码

  1. <view class="page-section-demo" style="position: relative;">
  2.   <map
  3.        id="map"
  4.        longitude="{{longitude}}"
  5.        latitude="{{latitude}}"
  6.        scale="{{scale}}"
  7.        controls="{{controls}}"
  8.        onControlTap="controltap"
  9.        markers="{{markers}}"
  10.        onMarkerTap="markertap"
  11.        polyline="{{polyline}}"
  12.        polygon="{{polygon}}"
  13.        circles="{{circles}}"
  14.        onRegionChange="regionchange"
  15.        onTap="tap"
  16.        onCalloutTap="callouttap"
  17.        show-location style="width: 100%; height: 300px;"
  18.        include-points="{{includePoints}}"
  19.        />
  20.   <cover-view
  21.     onTap="onCoverViewTap"
  22.     style="text-align: center; width: 100px; height: {{height2}}px;position: absolute; left: 20px; top: 10px;color: white; font-size: 20px;background-color: rgba(0, 0, 255, 0.5)"
  23.   >
  24.       1111
  25.   </cover-view>
  26.   <cover-image
  27.     onTap="onCoverImageTap"
  28.     style="height: 50px;width: 50px;position: absolute; top: 100px;left: 10px;" src="/image/ant.png"
  29.   />
  30. </view>

Tips

  • cover-view和cover-image暂时不支持嵌套。

原文: https://docs.alipay.com/mini/component/cover-view