vue.js的组件样式用了scoped后可以无顾忌地使用!important吗。

Question

想着用了scoped后组件间的样式不会相互影响，那么当我覆盖组件库中组件的样式时，在我当前组件中使用!important是否合理（因为组件库里头组件的样式嵌套层数深，用更深的层次总是觉得不如用!important来得简单）求大神指点

Answer 1

建议尽量不要用!important,用了开发一时爽,后期维护不那么如意了.组件模板外层套一个class,权值足够用了.

Answer 2

强烈建议不要使用!important, 另外嵌套也尽量少用，会影响性能，我情愿多写几个类

Answer 3

scoped已经对组件进行了唯一限制,使用important也只会影响该组件内的内容,用不用都无所谓了

Answer 4

scoped就是对组件内的css添加一个随机前缀.. 所有受到那个随机前缀影响的css都可以放心使用!important

Answer 5

!impotant不到万不得已, 不要用. 实在是个危险的东西.

虽然scoped已经限制了样式只对组件内元素生效, 但是同一个组件内也可能出问题, 比如一个体积比较大的组件, 你用了!important, 以后扩展, 修改, 维护的时候就可能会出事儿. 毕竟时间一长, 自己就忘了这档子事儿啦.

当然, 你要说你肯定忘不了, 就是要important, 那也可以. 只是要无故多写几个字符, 好痛苦呀. 像我这种平时多写个分号都要满地打滚儿的, 受不了. 多加个!important就是10个字符, 五个字节, 2亿次访问就浪费了一个G的流量. 多浪费呀, 是不是. :)