我试图有条件地在body标签上设置一个类。本身这是微不足道的，不是问题，但是当有多个组件同时有条件地同时写入body标签的class属性时，它们开始相互覆盖。他们中只有一个保持活跃，而其他人则被忽略。例：
// Sidebar.js
const Sidebar = () => (
// ...
<Helmet>
<body className={menuOpen ? 'blur' : ''} />
</Helmet>
// ...
);
// Loader.js
const Loader = () => (
// ...
<Helmet>
<body className={isLoading ? 'hidden' : ''} />
</Helmet>
// ...
);
在此示例中，边栏必须在活动状态下通过在body标签上设置类来禁用滚动（并出于设计目的而模糊页面）。加载程序处于活动状态时需要禁用滚动（它是全屏预加载程序）。侧边栏组件在此处具有优先级，而Loader组件中的Helmet标签只是被忽略。
我该如何进行这项工作？
编辑：当然，我可以只使用DOM API并手动设置/删除类，这是我目前正在做的事情，但是想知道是否还有更多的反应方式可以做到这一点。
最佳答案
在class属性中维护所需项的数组，然后使用helmet应用该数组