vue中 css scoped原理

Vue中css的逻辑是先放子组件,然后放父组件,所以同样的css类名,子组件会被父组件覆盖

html 如下

子被父覆盖

scoped是通过给组件加hash值,锁定组件。

父子组件均scoped的情况下,子仍会覆盖

还是被覆盖了

如何避免被覆盖?
父子组件不要用相同的class名称

相关推荐
梦想的颜色14 小时前
TypeScript 完全指南(中):函数、接口、类与高级类型
前端·typescript
鹏多多14 小时前
OpenSpec+SDD规范驱动AI Agent开发项目实战指南
前端·vue.js·react.js
叶小树咯14 小时前
React 为什么不能像 Vue 那样 state.count++
前端·react.js
ricardo197315 小时前
防抖节流进阶 + requestAnimationFrame:滚动与输入场景的性能优化
前端·面试
wjj不想说话15 小时前
你项目里的 Pinia,可能已经成了第二个 localStorage
前端·vue.js
wuhen_n15 小时前
LangChain JS 入门:快速搭建前端 AI 开发环境
前端·langchain·ai编程
天蓝色的鱼鱼15 小时前
画1万个图形就卡成PPT?试试这款国产高性能2D引擎
前端·javascript
云水一下15 小时前
JavaScript 从零基础到精通系列:异步编程与网络请求
前端·javascript
卡卡军16 小时前
🌈 react-sketch-ruler v3 升级之旅:当 React 遇上跨框架标尺引擎
前端·react.js
Asmewill16 小时前
DeepAgents学习笔记三(Backend记忆存储)
前端