vue加scoped后就无法修改vant的UI组件的样式

为了vue页面样式模块化，不对全局造成污染，每个页面的style标签加上scoped，表示他的样式只属于当前的页面，父组件的样式不会泄漏到子组件中。但是scoped也会造成一些额外的负担，如无法覆盖原有组件的样式。

解决方法：

使用深度选择器，将scoped样式中的选择器“深入”，即影响子组件

<style scoped>
  .van-tab >>> .van-ellipsis { /* ... */ }
</style>

以上的代码会编译成：

.van-tab[data-v-f3f3eg9] .van-ellipsis { /* ... */ }

注意：如果你使用了Less或Sass等预处理器，可能无法>>>正确解析。在这些情况下，您可以使用组合/deep/或::v-deep组合 - 两者都是别名，>>>并且工作完全相同。

使用Less或Sass等预处理器的写法如下：

.van-tab {
  /deep/ .van-ellipsis {
    font-weight: bold;
  }
}