React组件设计实践总结03 - 样式的管理
Bobi.ink
2019-05-14
CSS 是前端开发的重要组成部分,但是它并不完美,本文主要探讨 React...至从那之后出现了很多 CSS-in-js 解决方案.
1️⃣ 全局性
CSS 的选择器是没有隔离性的, 不管是使用命名空间还是 BEM 模式组织, 最终都会污染全局命名空间....6️⃣ CSS 解析方式的不确定性
CSS 规则的加载顺序是很重要的, 他会影响属性应用的优先级, 如果按需加载 CSS, 则无法确保他们的解析顺序, 进而导致错误的样式应用到元素上....important 声明属性, 这无疑是进入了另一个坑.
解决方向:避免使用全局样式,组件样式隔离;样式加载和组件生命周期绑定
----
2....: React.CSSProperties;
}
这两个属性应该是每个展示型组件应该暴露的 props, 其他嵌套元素也要考虑支持配置样式, 例如 footerClassName, footerStyle