收藏
回答

oppo r9机型下cover-view无法遮住canvas

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 客户端 7.0.4 2.4.0

- 当前 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 个回答

登录 后发表内容