关于styled-components的问题

来源:7-2 使用 styled-components 完成 Header 组件布局(1)

wykun

2018-08-23

老师,我使用styled-components的时候,我发现了一些问题.比如..用了这个确实可以实现组件之间的样式不相互干扰,但是写起来好累啊..没有自动补全..对于每天干活做项目的我来说..效率实在是低(我用的vscode)
另一个问题是,如果采用这种方式,之前我比如使用一些类似预处理器,如: 变量,函数这些东西感觉都不能用了...请问老师有什么好的建议吗..

写回答

2回答

瑜伽兔子

2018-08-26

我目前开发的项目没有使用styled-component,而是在每个组件的最外层,定义一个class的命名空间,比如xxx-xxx-container, 然后使用sass或者less, 嵌套来定义内部的样式,这样来避免冲突,当然在sass、less中你说的就都有了

0
3
Dell
回复
瑜伽兔子
是的,成本有
2018-09-02
共3条回复

Dell

2018-08-25

styled-component中完全可以使用变量,这个我觉得你这是不会用而已,并不是它没有这种能力。第二点,如果你需要自动补全,那么可以下载对应的插件,或者自己写插件来解决这个问题。第三点,我并不认可自动补全功能,工作这么久,我从来也不使用这个功能,因为它会让我无法在没有编辑器的情况下保证代码的质量,所以你会看到,我在写代码的时候没有任何语法提示也可以一样工作,我也建议你不要依赖这样的工具完成编码过程,并不是效率低,而是你的基础编程能力还比较弱。

6
1
ZAnsder
个人认为,单从js文件利用字符串模板写css来说,比如单词拼错很常见的错误,第一时间无法定位,这时styled-component补缺插件就很重要,编码阶段就会报错提示,老师课程也反映了这个问题,background敲错了,却需要编译后,看到样式没显示再回头找问题,这是其一。其二,对于某些样式属性单词,无法记得很牢固,代码提示后,一个一个字敲,不需要再去查阅,这对新手很重要。所以还是取决于个人自觉能力,也很认可老师说的,我认为即便有自动补全这功能,也要手动敲下去。要利用插件的优点,来提高我们的编程能力,而不是投机取巧。
2019-05-24
共1条回复

React零基础入门到实战,完成企业级项目简书网站开发

主流新技术 React-redux,React-router4,贯穿基础语法

5275 学习 · 2496 问题

查看课程