React项目中遇到的兼容问题(M端适配APP)

M站项目

问题描述：

1.视频打不开时右上角返回无效，导致无法返回（M站）

ios机出现的问题，发现ios14.3、14.4版本正常，ios12版本点击不灵敏

后发现原因是有个div 样式visibility：hidden[设置元素不可见]并充满整个屏幕，ios12版本不兼容

解决方法：换成display:block

2.chat按钮没有固定（M站）

ios机出现的问题，发现ios14.3、14.4版本正常，ios12版本不固定

底部聊天室按钮放在最外层就可以了

3. M站需要锚点动画效果

使用方法dom.scrollIntoView({ behavior: ‘smooth’ });
后发现ios不j兼容scrollIntoView( )方法的动画属性

4.帮助中心M站链接在企业微信中打开，点击聊天室跳转出现短暂黑屏的问题（目前仅IOS存在问题）

原因暂不明确，猜测可能是内嵌iframe没能及时获取src导致的

解决方案：
1.iframe初始高度为0，用延时5秒给他高度，后发现会导致进入聊天室，内容左移，切换tab之后正常
2.进入聊天室先遮罩，5秒后关闭遮罩

5.帮助中心M站Adroid自带浏览器和谷歌浏览器打开是点击tab栏楼层跳跃时会造成整个页面拉伸

原因：scrollIntoView({behavior: “smooth”});方法如果父级以上有滚动条会拉动整个document移动

效果如图