已关闭,此问题需要details or clarity。它目前不接受回答。
**想改善这个问题吗?**通过editing this post添加详细信息并澄清问题。
4天前关闭。
Improve this question
假设在浏览器上显示了 Jmeter 板页面,但登录和 Jmeter 板组件的样式都加载到了浏览器的DOM中(Inspect-Element-Head-style)。这是不正确的。样式应该只呈现为特定的组件,所以我想为一个特定的组件的CSS文件加载在浏览器中
我尝试从“./Mycourent.module.css”导入样式;但在这种情况下也加载所有样式。我想在浏览器上只加载样式活动组件。
1条答案
按热度按时间huwehgph1#
如果你在任何特定组件中导入任何样式表。这种风格将适用于整个React网站。让我给予你举个例子。
如果有两个组件文件login.tsx和dashboard.tsx以及两个css文件login.css和dashboard.css,
你是导入login.css在login.tsx和dashboard.css在dashboard.tsx文件.
例如,如果你在login.css文件中给.container类一个样式。如果你在dashboard.tsx中有相同类名的元素,那么这个样式也会应用到dashboard中。
因为最后react会把所有的css打包成一个css文件,这个文件会应用到整个webapp上。
如果你想动态加载样式表,那么你应该动态导入组件。这也不是最好解决方案,因为无论何时动态加载任何组件,css都可能影响已经加载的UI。你可以看看here来了解如何动态加载组件。
如果你想更有效地使用css,而不影响其他人,你可以很好地组织它,那么我会建议styled-components in react。