收藏
回答

cover-view抖动

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug cover-view 客户端 7.0.3 2.4.2

<block wx:for="{{mapSkuList}}" wx:key="index">

<cover-view class='sku-content-list active' wx:if="{{activeBanner == index}}">

<cover-view class='img'>

<cover-image class="image" src='{{item.img}}' mode="aspectFill"></cover-image>


</cover-view>

<cover-view class='color active'>{{item.skuColor}}</cover-view>

<cover-view class='mashu active'>({{item.skuSize}})</cover-view>

<cover-view class="sku-content-size-right">


<cover-view class="minusIcon active" data-index="{{index}}" wx:key="index" bindtap="minusSkuNumber">-</cover-view>

<cover-view class="skuNumber active">{{item.selectNumber}}</cover-view>


<cover-view class="plusIcon active" wx:key="index" data-index="{{index}}" bindtap="plusSkuNumber">+</cover-view>

</cover-view>

</cover-view>

<cover-view class='sku-content-list' catchtap="changeBanner" wx:else data-index="{{index}}" data-pic="{{item.price}}" data-suggestedPrice="{{item.suggestedPrice}}" data-num="{{item.stockNumber}}" data-img="{{item.img}}">

<cover-view class='img'>

<cover-image class="image" src='{{item.img}}' mode="aspectFill"></cover-image>

</cover-view>


<cover-view class='color'>{{item.skuColor}}</cover-view>

<cover-view class='mashu'>({{item.skuSize}})</cover-view>

<cover-view class="sku-content-size-right">

<cover-view class="minusIcon" bindtap="minusSkuNumber" wx:key="index" data-index="{{index}}">-</cover-view>

<cover-view class="skuNumber">{{item.selectNumber}}</cover-view>

<cover-view class="plusIcon" bindtap="plusSkuNumber" wx:key="index" data-index="{{index}}">+</cover-view>

</cover-view>

</cover-view>

</block>

列表中有视频,考虑到层级问题,就用cover-view标签,sku上绑定的事件catchtap="changeBanner" 改变sku的背景颜色,bindtap="plusSkuNumber",bindtap="minusSkuNumber"数量的加减,点击的时候sku都有很多的抖动,体验感不好,用view标签就不会有这样的情况,这是什么原因?能解决嘛?

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

2 个回答

  • W
    W
    2019-02-15

    <cover-view class="sku-content-block">

    <cover-view class="sku-content-size-box">

    <cover-view class="sku-content-size">

    <block wx:for="{{mapSkuList}}" wx:key="index">

    <cover-view class='sku-content-list active' wx:if="{{activeBanner == index}}">

    <cover-view class='img'>

    <cover-image class="image" src='{{item.img}}' mode="aspectFill"></cover-image>


    </cover-view>

    <cover-view class='color active'>{{item.skuColor}}</cover-view>

    <cover-view class='mashu active'>({{item.skuSize}})</cover-view>

    <cover-view class="sku-content-size-right">


    <cover-view class="minusIcon active" data-index="{{index}}" wx:key="index" bindtap="minusSkuNumber">-</cover-view>

    <cover-view class="skuNumber active">{{item.selectNumber}}</cover-view>


    <cover-view class="plusIcon active" wx:key="index" data-index="{{index}}" bindtap="plusSkuNumber">+</cover-view>

    </cover-view>

    </cover-view>

    <cover-view class='sku-content-list' catchtap="changeBanner" wx:else data-index="{{index}}" data-pic="{{item.price}}" data-suggestedPrice="{{item.suggestedPrice}}" data-num="{{item.stockNumber}}" data-img="{{item.img}}">

    <cover-view class='img'>

    <cover-image class="image" src='{{item.img}}' mode="aspectFill"></cover-image>

    </cover-view>


    <cover-view class='color'>{{item.skuColor}}</cover-view>

    <cover-view class='mashu'>({{item.skuSize}})</cover-view>

    <cover-view class="sku-content-size-right">

    <cover-view class="minusIcon" bindtap="minusSkuNumber" wx:key="index" data-index="{{index}}">-</cover-view>

    <cover-view class="skuNumber">{{item.selectNumber}}</cover-view>

    <cover-view class="plusIcon" bindtap="plusSkuNumber" wx:key="index" data-index="{{index}}">+</cover-view>

    </cover-view>

    </cover-view>

    </block>

    </cover-view>

    </cover-view>

    </cover-view>


    2019-02-15
    有用
    回复
  • 社区技术运营专员-小柿子
    社区技术运营专员-小柿子
    2019-02-15

    麻烦提供下代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)

    2019-02-15
    有用
    回复 5
    • W
      W
      2019-02-15

      是什么原因造成的?


      2019-02-15
      回复
    • W
      W
      2019-02-15

      https://developers.weixin.qq.com/s/wucKzcmt7h6a

      2019-02-15
      回复
    • W
      W
      2019-02-15

      看到回复一下


      2019-02-15
      回复
    • W
      W
      2019-02-15

      真机上会有抖动


      2019-02-15
      回复
    • 社区技术运营专员-小柿子
      社区技术运营专员-小柿子
      2019-02-19回复W

      测试了下,未复现你说的抖动的情况,能否提供下视频呢?

      2019-02-19
      回复
登录 后发表内容