我正在渲染一个卡片列表,每个卡片显示一些数据以及三行,允许用户导航到该卡片的特定扩展部分。
出于某种原因,Safari 似乎为每张卡片渲染了三个导航行,但它们是白色且透明的。我知道它们已被渲染,因为我仍然可以单击该行所在的空间并且导航按预期工作。它只是看不见。
使用 Chrome 时不会出现此问题。它只发生在 Safari 上:无论是在浏览器中的桌面上还是在 iOS 上运行 Safari 时。控制台中没有错误。
另一个奇怪的难题是,当我在 Safari 中检查元素时,它们出现在屏幕上!这是link我拍摄的展示该行为的视频。
有什么想法吗???
最佳答案
以防万一有人偶然发现这一点,我采纳了 Jay 的建议并开始修剪 CSS。最终我意识到“更新行”同时设置了显示:“flex”和位置:“相对”。一旦我删除了position:“relative”(它一开始并没有做任何事情,但一定是错误添加的),Safari 就完美地呈现了它。
TLDR:对于 Safari,在同一个 div 上显示:“flex”和位置:“relative”会产生渲染问题。
关于reactjs - React Project : Safari seems to be rendering, 但不绘制元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64124108/