搜索到
1
篇与
的结果
-
React中编写css的几种方式 React中编写css的几种方式使用的是原生css样式，在.js文件中引入并使用className(原生css, 缺点是不方便样式隔离，容易造成样式污染)行内样式（缺点：行内样式的通用缺点）CSS Module 例如：index.module.scss index.module.less index.module.csscss-in-jscss-in-js是在js中直接编写css的技术，也是react官方推荐的编写css的方案。CSS Module也具有良好的开发体验，性能也更好。优点：同vue的scpoe可以做到样式隔离的效果代码共享，轻松在 JS 和 CSS 之间共享常量和函数方便CSS单元化测试劣势：增加运行时开销。增加构建后产物体积。使 React DevTools 变得混乱，debug 时可读性变差CSS-in-JS并不是一颗能完美解决样式维护难题的银弹，但是通过借助一定最佳实践后，足以应对大多数前端需求，比如主题切换、组件样式封装、用户端样式覆盖等等，并显著提升前端团队在维护样式时的工作效率，css-in-js方案比较从体积来看：emotion的体积是最小的。从技术生态环境（以及流行程度）：styled-components的star最多，文档相对来讲也是最完善的。从支持的特性来看：emotion、aphrodite、jss支持的特性是最多的。CSS-in-JS Playground是一个可以快速尝试不同CSS-in-JS实现的网站，在线尝试（https://www.cssinjsplayground.com/）
