scoped父组件，如何控制子组件样式 - 方法篇

scoped父组件，如何控制子组件样式 - 方法篇

需求场景：

• 在vue组件中，在style标签上添加scoped属性，以表示它的样式作用于当下的模块，很好的实现了样式私有化的目的，这是一个非常好的机制。但是为什么要慎用呢？在实际业务中我们往往会对公共组件样式做细微的调整，如果添加了scoped属性，那么样式将会变得不易修改。初写这篇文章时，本人没有找到一个好的方法去解决这个问题，后来经过大伙的解答，才让我恍然大悟。（文字摘选自> 简书地址）

---

方法1：混用本地和全局样式

你可以在一个组件中同时使用有作用域和无作用域的样式。

<style>
/* 全局样式 */
</style>

<style scoped>
/* 本地样式 */
</style>

解决方案：

• 查看详情： vue官方文档 · vue-loader之scoped-css

• 参考阅读：简书地址

疑问：style 和 style scoped 相比，排版先后顺序有没有优先级区别？

---

以上就是关于“ scoped父组件，如何控制子组件样式 - 方法篇 ” 的全部内容。