1. 减少不必要的 setData 可以消除 data 变化导致的闪烁现象 2. 使用普通 image 代替 cover-image 、普通 view 代替 cover-view 可以减弱由于 cover 组件创建偏慢导致的闪烁现象（但要注意组件层叠层级） 但 android 本身的的渲染延迟仍然会导致一部分闪烁现象

在swiper组件中，IOS给组件添加相对定位无效，导致组件item绝对定位无法在组件中，溢出隐藏失效，swiper-item超出swiper，border-radius效果无法实现。 安卓中效果： [图片] 苹果中效果： [图片] 开发工具中： [图片] 代码片段： [代码][代码][代码]    [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"bannerBar"[代码][代码]>[代码][代码]        [代码][代码]<[代码][代码]view[代码] [代码]class[代码][代码]=[代码][代码]"banner-box"[代码][代码]>[代码][代码]            [代码][代码]<[代码][代码]swiper[代码] [代码]class[代码][代码]=[代码][代码]"banner"[代码] [代码]autoplay indicator-dots [代码][代码]indicator-color[代码][代码]=[代码][代码]"#fff"[代码] [代码]indicator-active-color[代码][代码]=[代码][代码]"#F5A623"[代码] [代码]interval[代码][代码]=[代码][代码]"6000"[代码] [代码]duration[代码][代码]=[代码][代码]"500"[代码] [代码]current[代码][代码]=[代码][代码]"0"[代码][代码]>[代码][代码]                [代码][代码]<[代码][代码]swiper-item[代码] [代码]wx:for[代码][代码]=[代码][代码]"{{3}}"[代码] [代码]wx:key[代码][代码]=[代码][代码]"ban-box"[代码][代码]>[代码][代码]                    [代码][代码]<[代码][代码]image[代码] [代码]mode[代码][代码]=[代码][代码]"widthFix"[代码] [代码]src[代码][代码]=[代码][代码]"/images/banner/banner@{{index + 1}}.jpg"[代码][代码]>[代码]image[代码][代码]>[代码][代码][代码][代码]                [代码][代码][代码]swiper-item[代码][代码]>[代码][代码][代码][代码][代码][代码]            [代码][代码][代码]swiper[代码][代码]>[代码][代码][代码][代码][代码][代码][代码]        [代码][代码][代码]view[代码][代码]>[代码][代码][代码][代码][代码][代码][代码]    [代码][代码][代码]view[代码][代码]>[代码][代码][代码][代码][代码]/*  Banner  */[代码][代码].bannerBar {[代码][代码]    [代码][代码]width[代码][代码]: calc([代码][代码]100%[代码] [代码]- [代码][代码]60[代码][代码]rpx);[代码][代码]    [代码][代码]height[代码][代码]: [代码][代码]350[代码][代码]rpx;[代码][代码]    [代码][代码]padding[代码][代码]: [代码][代码]30[代码][代码]rpx;[代码][代码]}[代码][代码].banner-box {[代码][代码]    [代码][代码]width[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码]    [代码][代码]height[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码]    [代码][代码]border-radius: [代码][代码]10[代码][代码]rpx;[代码][代码]    [代码][代码]box-shadow: [代码][代码]0[代码] [代码]0[代码] [代码]50[代码][代码]rpx rgba([代码][代码]0[代码][代码], [代码][代码]0[代码][代码], [代码][代码]0[代码][代码], [代码][代码]0.2[代码][代码]);[代码][代码]    [代码][代码]overflow[代码][代码]: [代码][代码]hidden[代码][代码];[代码][代码]    [代码][代码]position[代码][代码]: [代码][代码]relative[代码][代码];[代码][代码]}[代码][代码].banner {[代码][代码]    [代码][代码]width[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码]    [代码][代码]height[代码][代码]: [代码][代码]100%[代码][代码];[代码][代码]    [代码][代码]border-radius: [代码][代码]10[代码][代码]rpx;[代码][代码]    [代码][代码]overflow[代码][代码]: [代码][代码]hidden[代码][代码];[代码][代码]    [代码][代码]position[代码][代码]: [代码][代码]relative[代码][代码];[代码][代码]}[代码]

在模拟器中的效果： [图片] 在真机上面的效果： [图片]

[代码]//在循环中通过判断item.msg来给标签添加背景颜色，（item.color在js中已根据item.msg做了更改）[代码][代码]//去掉标红处的单引号也不行，不去掉会是字符串[代码][代码]<[代码][代码]view[代码][代码] [代码][代码]style[代码][代码]=[代码][代码]"background-color:[代码][代码]{{'{{item.msg}}'?'{{item.color}}':'{{item.color}}'}}[代码][代码]"[代码][代码]>[代码][代码]点击购买[代码][代码]</[代码][代码]view[代码][代码]>[代码]