React Routes-身体CSS标签的样式不同
我的React应用程序上有两条路线：/a和/b。
对于/ a，我希望bodycss标记具有一个background-color: red;。
对于/ b，我希望bodycss标记具有一个background-color: blue;。
这两个组件a和b都位于不同的.JSX文件中，并且都导入自己的main.scss文件，这些文件定义了各自的body background-color。
但是，由于将整个应用程序编译到body标记中，因此似乎存在冲突，并且body两条路径仅尊重其中一个标记。
<body>
<script src="bundle.js" type="text/javascript"></script>
</body>
我希望它在body标签上而不只是在容器div上的原因是，background-color当我在页面边界之外滚动时（在Mac和iOS上的反弹效果），我希望可见。
正确的方法是什么？
第3629篇《React Routes-身体CSS标签的样式不同》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点
我同意QoP所说的，但是作为补充，您还应该确保使用componentWillUnmount将其设置回该组件之外的任何位置。
例如：如果通常在整个应用程序中都保留text-align，但是对于一个组件，您希望它居中，但是在组件需要返回到左边之后，您将执行以下操作：
componentDidMount() {
document.body.style.textAlign = "center"
}
componentWillUnmount(){
document.body.style.textAlign = "left"
}
之所以发生这种情况，是因为当您在没有CSS模块的组件中导入样式时，这些样式是全局的，因此您的主体样式被定义了两次（您可以在<head>标记中看到所有样式）。
您可以通过在组件componentDidMount（）方法中设置背景色来解决此问题。
例
componentDidMount(){
document.body.style.backgroundColor = "red"// Set the style
document.body.className="body-component-a" // Or set the class
}
相似问题
问题类别
添加此代码
希望对您有所帮助。