Vue文件组件中，style的scoped中定义全局样式

scoped样式

vue文件组件中，使用scoped来定义样式模块的局部作用域。

<template></template>
<script></script>
<style scoped></style>

定义了scoped作用域的样式只适用于当前文件中，类似于私有化了。

scoped作用域中定义全局样式

但是要是想在定义了scoped的样式中，来定义全局作用的样式。使用>>>来突破作用域，是指全局可见。

.text_drawer >>> .el-drawer__body {
   overflow-y: auto !important;
}

使用实例

使用element-ui的el-drawer组件来定义一个抽屉，展示使用说明文档。因为文档很长，需要上下方向的滚轮。el-drawer加滑动条是在全局范围（因为我的具体内容是使用另外一个子组件来展示的，滚轮的样式必须定义在全局范围才能起效）

<el-drawer
    title="使用帮助"
    :visible.sync="need_help"
    direction="rtl"
    class="text_drawer"
    >
   <help-guide></help-guide>
    </el-drawer>

 滑动条样式定义

<style scoped>
.text_drawer >>> .el-drawer__body {
   overflow-y: auto !important;
}
</style>

参考：vue模块私有组件中(scoped)设置全局样式_vue scoped 全局样式_API搬运工的博客-CSDN博客