vue2组件中style节点设置scoped,样式失效

style 节点的 scoped 属性是为了防止组件之间的样式冲突,实现样式模块私有化,避免全局样式污染

对于 style上加了 scope 属性的组件，会主动加上 data-v-xx 的属性来唯一标识当前组件

如果给当前组件的 style 节点添加了 scoped 属性,则当前的样式对其子组件是不生效的,

如果想让某些样式对子组件生效, sass 和 less 的样式穿透,可以使用 /deep/ 深度选择器

<style lang="less" scoped>
.title  /deep/ .title1{
    color: white;
  }
</style>

或者使用两个 style 标签

<style>
/* 用于修改第三方库的样式 */
</style>
 
<style scoped>
/* 自己的组件内样式 */
</style>