在React中,公共CSS在另一个页面中不起作用的原因可能是由于组件的隔离性导致的。React组件具有自己的作用域,每个组件都有自己的CSS样式表。当一个组件被渲染到页面上时,它只会应用自己的CSS样式,而不会影响其他组件。
为了解决这个问题,可以采取以下几种方法:
public/index.html
文件中的<head>
标签中引入全局CSS文件。[name].module.css
,React会自动将CSS样式表转换为模块化的形式。在组件中引入CSS样式时,可以使用import styles from './styles.module.css'
的方式,并通过className={styles.className}
来应用样式。这样可以确保每个组件的样式只在自己的作用域内起作用。总结起来,解决公共CSS在React中另一个页面中不起作用的问题可以通过使用全局CSS、CSS模块化或CSS-in-JS库来实现样式的共享和隔离。具体选择哪种方法取决于项目的需求和个人偏好。
腾讯云相关产品和产品介绍链接地址:
云+社区技术沙龙[第8期]
腾讯数字政务云端系列直播
微搭低代码直播互动专栏
第四期Techo TVP开发者峰会
领取专属 10元无门槛券
手把手带您无忧上云