页面在真机上偶尔出现毛刺，求指教
小程序页面在大多数情况下正常展示，但是在极少数情况下，会偶尔出现毛刺、断层等现象。请问这是什么原因呢？求大神指教：
5 回复
css文件：
@import "./dialog/dialog.scss";$footer-height: 120rpx;$footer-border: 2rpx solid #cacaca;$title-font-size: 30rpx;$sub-title-font-size: 28rpx;$coupon-value-font-size: 48rpx;$card-item-height: 243rpx;.full-container { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: #f9f9f9;}.no-card-info { font-size: 28rpx; color: #8c8c8c;}.footer { position: absolute; bottom: 0; left: 0; right: 0; height: $footer-height; background-color: #ffffff; border-top: $footer-border; display: flex; flex-direction: row;}.scroll-content { position: absolute; bottom: $footer-height; left: 0; right: 0; top: 0; background-color: #f2f2f2;}.button-footer { font-size: 36rpx; width: 50%; height: 100%; color: #ababab;}.button-footer-selected { color: #f6a573;}.botton-footer-left { border-right: $footer-border;}.button-footer-wrapper { height: 100%; text-align: center; vertical-align: middle; line-height: $footer-height;}.card-items { background-color: #f2f2f2; padding: 32rpx;}image { background-color: transparent;}.card-item { display: flex; flex-direction: row; margin-top: 20rpx; filter: drop-shadow(4rpx 4rpx 4rpx #cccccc); background-color: transparent;}.card-item-disabled { color: #aeaeae;}.card-item-wrapper { height: $card-item-height; width: 100%; background-color: #ffffff;}.item-left-image { width:67rpx; height:$card-item-height;}.card-item-action { width: 185rpx; height: $card-item-height; line-height: 260rpx; vertical-align: middle; text-align: center; font-size: $sub-title-font-size; font-weight: bold; color: #ffffff; background-color: transparent; white-space: nowrap;}.card-item-action-text { width: 185rpx; height: $card-item-height;}.card-item-action-disabled { color: #a1a1a1;}.card-item-title { display: flex; flex-direction: row; font-size: $sub-title-font-size; padding: 12rpx 0; height: 48rpx;}.card-item-vendor { width: 60rpx; white-space: nowrap;}.card-item-name { padding-left: 8rpx;}.card-item-body { display: flex; flex-direction: row;}.card-item-logo { display: inline-block; margin-left: 4rpx;}.card-item-value { display: flex; flex-direction: row; margin-top: -10rpx; margin-bottom: 10rpx;}.card-item-value-number-left { font-size: $coupon-value-font-size; color: #F8955F;}.card-item-value-number-right { font-size: $coupon-value-font-size; color: #F8A71C;}.card-item-value-number-disabled { color: #cbcbcb; font-size: $coupon-value-font-size;}.card-item-rule { font-size: 24rpx; color: #ababab;}.card-item-time-limit { font-size: 24rpx; color: #ababab;}.card-item-value-limit-left { font-size: 28rpx; color: #F8955F; padding-top: 24rpx; padding-left: 20rpx;}.card-item-value-limit-right { font-size: 28rpx; color: #F8A71C; padding-top: 24rpx; padding-left: 20rpx;}.card-item-value-limit-disabled { color: #cbcbcb; font-size: 28rpx; padding-top: 24rpx; padding-left: 20rpx;}.card-item-image { display: inline-block; width: 53rpx; height: 34rpx;} |
这是主要的html文件：
<import src="./dialog/dialog.wxml"/><template is="dialog" data="{{...qrCodeModalInfo}}"/><view class="full-container"> <scroll-view wx:if="{{currentTab==2}}" class="scroll-content" scroll-y="true"> <import src="./myCard/myCard.wxml" /> <template is="myCard" data="{{...myCards}}" /> </scroll-view> <scroll-view wx:if="{{currentTab==1}}" class="scroll-content" scroll-y="true"> <import src="./recommendCard/recommendCard.wxml" /> <template is="recommendCard" data="{{...recommendCards}}" /> </scroll-view> <view class="footer"> <view class="button-footer {{currentTab == 1 ? 'button-footer-selected' : ''}}" bindtap="chooseRecommend"> <view class="botton-footer-left button-footer-wrapper"> <image wx:if="{{currentTab == 1}}" src="../../images/recommend-icon.png" style="width: 34rpx; height: 36rpx;"/> <image wx:if="{{currentTab != 1}}" src="../../images/recommend-icon-grey.png" style="width: 34rpx; height: 36rpx;"/> 卡券推荐 </view> </view> <view class="button-footer {{currentTab == 2 ? 'button-footer-selected' : ''}}" bindtap="chooseMyCards"> <view class="button-footer-wrapper"> <image wx:if="{{currentTab == 2}}" src="../../images/my-card-icon.png" style="width: 44rpx; height: 30rpx;"/> <image wx:if="{{currentTab != 2}}" src="../../images/my-card-icon-grey.png" style="width: 44rpx; height: 30rpx;"/> 我的卡券 </view> </view> </view></view> |
这是其中一个template文件：
... |
