导语:在vue中我们引用了组件,但是在其外面套一个盒子之后,该组件仍然不能改动。一般情况下从库中被调用的子模块组件是不会随意更改的,这个时候可以你想要更改组件样式的话,可以在全局样式中修改。
1.原因 首先组件不能改动,是因为在该子模块的less文件中,scope这个属性。
代码语言:javascript复制<style lang="scss" scoped>
scoped的作用:表示它的样式作用于当下的模块,可以使组件的样式不相互污染。 当去掉它的时候,组件能够改动,但是有可能会导致项目中的其他的页面发生页面变形的现象,一般我们是不会将scoped去掉的。
2.解决办法 修改全局less文件,将要改动的组件放在全局中,然后子模块的less文件再引入全局less文件。这个才是正确的办法。
3.图片展示
要将它修改成为下图: