深度选择器的三种使用方式

在vue中,当< style>标签有scoped属性是,它的css制作用与当前组件的元素. 也就是在我们日常开发中,父组件不能直接作用于子组件,这时候有两个方法:
一是把scoped去掉,但是这样的话不仅是自己会影响别的元素,别的元素也会影响自身,所以这个方法一般不会使用.
二是在样式前面添加/deep/或::v-deep,还有个>>>,箭头方法会有兼容问题,像Sass之类的预处理器无法正确解析
应用场景一：父组件影响子组件
应用场景二：在页面中印象引入的样式

/deep/

  /deep/.van-uploader__upload {
      width: 90 * 100vw/360;
      height: 90 * 100vw/360;
    }

::v-deep

::v-deep.van-uploader__upload {
      width: 90 * 100vw/360;
      height: 90 * 100vw/360;
    }