oppo r9机型下cover-view无法遮住canvas
发布于 6 年前 作者 llu 2801 次浏览 来自 问答
  • 当前 Bug 的表现(可附上截图)

在其他机型下,cover-view可以遮住canvas,但是在oppo r9这款机型下,cover-view无法遮住canvas。而且cover-view显式设置宽度,如果不设置,在真机上文字可能会被截断。

代码片段:

wepy组件:

<cover-view class=“curtain-container” wx:if="{{ show }}" catchtouchmove=“catchTouchMoveHandler”>

    <!-- 用户头像 -->

    <cover-image wx:if="{{ type == 2 }}" class=“photo” src="{{ info.current_user.avatar || ‘https://cmspic-10004025.image.myqcloud.com/99f21106-703d-47b4-82cd-5983a199a604’ }}" />

    <cover-view class=“container {{ type == 2 ? ‘more’ : ‘’ }}”>

      <cover-image class=“background-image” src=“https://cmspic-10004025.image.myqcloud.com/6/c0854f60-7c2f-11e9-96ad-5db84f9cf5b6_size_671x803”>

      <!-- 券及文案描述 -->

      <cover-view class=“content”>

        <!-- 抢购的样式 -->

        <cover-view class=“header”>

          <cover-view class=“title”>

            <cover-view style=“display: inline-block !important;width: 290rpx;”>“谢谢你帮我砍了</cover-view>

            <cover-view style=“display: inline-block !important;” class=“price”>{{ price }}</cover-view>

            <!-- cover-view必须设置宽度 -->

            <cover-view style=“display: inline-block !important;width: 72rpx;”>元”</cover-view>

          </cover-view>

          <cover-view class=“tips”>送你{{ couponNum }}张大额优惠券</cover-view>

        </cover-view>

      </cover-view>

  </cover-view>

页面:

<canvas class=“qr-code” canvas-id=“qrCode” />

  • 预期表现

oppo r9和其他机型一样,cover-view可以遮住canvas

  • 复现路径

用上面的代码即可

  • 提供一个最简复现 Demo
1 回复

麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及这种格式的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

回到顶部