小程序
小游戏
企业微信
微信支付
扫描小程序码分享
我在swiper内使用了wx:for循环实现如下图1效果:
但是很大概率会出现内容不显示的问题(如图2),按住不显示的地方又会显示出来了(如图3)。
19 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
这个问题目前判断是 iOS 系统绘制的 bug ,目前我们也没有办法解决。
通常,这个问题由一些特殊的 CSS 样式设置引起,比如特殊的 position 定位等,但也没有很明确的规律性。这里能给出的建议是不要使用 position: absolute,而是用一些其他的方法达到效果。
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
好的。这个bug我们仔细查一下。因为是绘制方面的问题,可能需要一段时间。
意思是,这样改之后就算是touch一下也显示不出来了,这样么?
麻烦提供一下相关的WXSS代码以便我们排查这个问题,谢谢。
明白你的问题了。怀疑与 .navgator-hover 中指定的某些样式有关(有些样式会引起iOS下的重绘bug)。
目前看来,比较可疑的样式是“transition”和与透明度相关的样式。麻烦去掉这些再看看有没有问题。
另外,iOS的版本是?
麻烦试一下把.navigator-hover的background-color修改为rgb(25, 25, 25)
看起来这一行的样式和前两行不一样,有哪些区别呢?
第三张图的“第3章”这一行是有哪些样式控制呢?
我的问题解决了。目前看不是 absolute position 导致的,是因为 z-index: -1 导致的。
在我的案例里,.current-date:before 设置为 z-index: -1 ,然后后面的所有元素都会消失。
但我发现在设置了 .today 样式的 swipe-item 里缺不会出现空白的问题。
我遇到的问题的解决办法给 .date 默认加上 :before 样式,让 z-index 从一开始就是 -1 而不会发生变化。
// .scss
.date {
flex:
1
;
position
:
relative
&:before, &:after {
content
''
display
block
absolute
margin
auto
left
0
right
}
&:before {
width
54
rpx;
height
z-index
-1
; // 去掉这个样式,就不会出现空白的情况。
top
bottom
&.today:before {
background
: $green-color;
&.current-date:before {
: $red-color;
iOS 11.3
WeChat 6.6.6
基础库 1.9.92
正在加载...
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
这个问题目前判断是 iOS 系统绘制的 bug ,目前我们也没有办法解决。
通常,这个问题由一些特殊的 CSS 样式设置引起,比如特殊的 position 定位等,但也没有很明确的规律性。这里能给出的建议是不要使用 position: absolute,而是用一些其他的方法达到效果。
好的。这个bug我们仔细查一下。因为是绘制方面的问题,可能需要一段时间。
意思是,这样改之后就算是touch一下也显示不出来了,这样么?
麻烦提供一下相关的WXSS代码以便我们排查这个问题,谢谢。
明白你的问题了。怀疑与 .navgator-hover 中指定的某些样式有关(有些样式会引起iOS下的重绘bug)。
目前看来,比较可疑的样式是“transition”和与透明度相关的样式。麻烦去掉这些再看看有没有问题。
另外,iOS的版本是?
麻烦试一下把.navigator-hover的background-color修改为rgb(25, 25, 25)
看起来这一行的样式和前两行不一样,有哪些区别呢?
第三张图的“第3章”这一行是有哪些样式控制呢?
我的问题解决了。目前看不是 absolute position 导致的,是因为 z-index: -1 导致的。
在我的案例里,.current-date:before 设置为 z-index: -1 ,然后后面的所有元素都会消失。
但我发现在设置了 .today 样式的 swipe-item 里缺不会出现空白的问题。
我遇到的问题的解决办法给 .date 默认加上 :before 样式,让 z-index 从一开始就是 -1 而不会发生变化。
// .scss
.date {
flex:
1
;
position
:
relative
;
&:before, &:after {
content
:
''
;
display
:
block
;
position
:
absolute
;
margin
:
auto
;
left
:
0
;
right
:
0
;
}
&:before {
width
:
54
rpx;
height
:
54
rpx;
z-index
:
-1
; // 去掉这个样式,就不会出现空白的情况。
top
:
0
;
bottom
:
0
;
}
&.today:before {
background
: $green-color;
}
&.current-date:before {
background
: $red-color;
}
}
iOS 11.3
WeChat 6.6.6
基础库 1.9.92