Vue:多组件样式冲突问题解决

一、场景描述

我们在开发Vue项目的时候,会有很多的组件,每个组件里,可能都会写相应的样式,这时候就会出现在父组件引入子组件的时候,同名样式会冲突的问题。从而导致样式出问题。

二、解决办法

style标签加上scoped属性即可

加上scoped之后,这个样式只会作用在当前组件的html模板上。

css 复制代码
<style scoped>
    .demo{
        background-color: orange;
    }
</style>
相关推荐
芝士加10 分钟前
还在用html2canvas?介绍一个比它快100倍的截图神器!
前端·javascript·开源
阿虎儿11 分钟前
React 引用(Ref)完全指南
前端·javascript·react.js
Ratten27 分钟前
解决 error when starting dev server TypeError crypto$2.getRandomValues
前端
coding随想30 分钟前
深入浅出DOM3合成事件(Composition Events):如何处理输入法编辑器(IME)的复杂输入流程
前端
六月的雨在掘金31 分钟前
狼人杀法官版,EdgeOne 带你轻松上手狼人杀
前端·后端
Ratten35 分钟前
【npm 解决】---- TypeError: crypto.hash is not a function
前端
前端小大白36 分钟前
JavaScript 循环三巨头:for vs forEach vs map 终极指南
前端·javascript·面试
晴空雨37 分钟前
面试题:如何判断一个对象是否为可迭代对象?
前端·javascript·面试
嘻嘻__38 分钟前
掘金沸点屏蔽脚本分享
前端·掘金社区
用户479492835691539 分钟前
🎨 Prettier 深度解析:从历史演进到内部格式化引擎的完整拆解
前端