reactjs - 无法修复 React 暗模式闪烁

Question

在我的 React 应用程序中实现暗模式时，我面临着一个令人沮丧的问题。应用程序读取localStorage并应用用户喜欢的主题（这一切都由完成use-dark-mode）。不幸的是，每次用户打开页面时，默认主题都会在启用暗模式之前闪烁。

现在，我浏览了互联网并发现，只需在解决问题后将特定代码（如此处所示）放入<script>标签中即可。<body>

问题是，似乎没有什么可以解决这个令人不快的闪光，并且它发生在所有浏览器中。我尝试将脚本移动到<head>标签内，甚至使用运行它window.onload，但似乎没有任何效果。

有没有人遇到过这样的问题？修复此闪光灯的最佳方法是什么？提前非常感谢！

这是GitHub 存储库的链接。 注意：我没有使用任何服务器端渲染。

score 0 · Accepted Answer

事实证明，修复非常简单。在你的标签index.html里面添加一点样式。<head>

<style type="text/css">
  body.light-mode {
    background-color: #F9FAFC;
  }

  body.dark-mode {
    background-color: #1A1A1A;
  }
</style>

1 回答 1