问题描述
列表页面进入下一页面的遮罩层卡死
偶发
android没这种情况, ios(所有机型)偶尔有
react-native-0.48
排查过程
1.去跳转过后的页面排查
里面有两个页面加载时的遮罩层loading样式
1.1 直接去掉两个遮罩层,可以,但是要更新,无法热更新至已有的App Store上的包 而且改了原有逻辑 不到万不得已,不采用这种方式
1.2 猜测是跳转后的页面内两个遮罩层的卡顿
①去掉第二个遮罩层,问题依旧存在 而且必现了
②第二个遮罩层延时,问题依旧偶发
③去掉第一个遮罩层,这个可以但还是需要更新,所以解决方案暂时排除。但是到这里怀疑是前一个页面跳转时的遮罩层和进入本页面的第一个遮罩层有冲突
2.跳转前的页面遮罩层排查
锁定问题,就是这个遮罩层和跳转逻辑有冲突
同理,不能直接去,想办法热更新或者改后端逻辑,让这个遮罩层不展示
这时候开始梳理控制开关的后端逻辑,发现有一个冗余逻辑导致了这种问题
大概情况就是
-------------------------------------------------->>
|
↓
“无法跳转的原因”
这样,一个判断逻辑,这里的遮罩层出现按道理出现了就不能跳转下一个页面
但是不知道当时后端的人为了解决什么问题,改了逻辑
-------------------------------------------------->>
| ↑
↓ |
“某种情况下继续跳转”
出现了一种,已经到了不能跳转的分支,他又加了逻辑让回原逻辑继续跳转,出现了这种问题
我们修改了逻辑,不用升级了
总结
前端的一点问题+后端的一点问题+可能和ios的页面机制有关+偶尔的网络状况不好
出现了这种偶发的只存在于ios的问题

本文记录了一次在react-native应用中遇到的iOS平台页面遮罩层卡死问题的排查过程。问题表现为从列表页面进入下一页面时,遮罩层出现卡死现象,且仅在iOS设备上偶发。经过对前后页面的遮罩层逐个排查,发现是由于前一页遮罩层和跳转逻辑之间的冲突导致。通过修正后端冗余逻辑,避免了遮罩层显示并允许正常跳转,从而解决了问题。总结认为,此类问题的发生涉及前端、后端以及iOS页面机制的交互,以及可能的网络状况影响。
42

被折叠的 条评论
为什么被折叠?



