vue less 样式穿透写法（个人实战）

刚开始，我网上一直找，搞不懂，可能我的方法有问题，所以写下，以swiper  来做例子

1. html 数据结构

<template>
  <div class="slite-box" v-show="show" @click="handleClick">
    <div v-swiper:mySwiper="swiperOption">
      <div class="swiper-wrapper">
        <div class="swiper-slide">
          <img
            class="swiper-img"
            src="//img1.qunarzz.com/sight/p0/2012/34/34ff324ece5d9537a3.img.jpg_600x330_a7b8fbf5.jpg"
          />
        </div>
      </div>
      <div class="swiper-pagination move-down"></div>
    </div>
  </div>
</template>

2.例如需要修改swiper 某项

3. 样式穿透 使用 /deep/

<style lang='less' scoped>
/deep/ .swiper-container{
  position: static;
}        //.swiper-container，想改的类样式
</style>

4.成功改变样式