問題：近日在做項目過程中遇到問題，想要在首頁上下滑動的基礎上實現第二屏左右滑動
解決：查看swiper中文官方文檔發現如何處理 ，重點區分好垂直滑動和水平滑動container和分頁器pagination，避免兩者沖突
預備工作：1、導入swiper插件（注意：一定要在頭部導入）2、設置樣式
<head> <link rel="stylesheet" href="../dist/css/swiper.min.css"> </head>
3、創建垂直container和水平container
<div class='swiper-container swiper-container-v'>
<div class='swiper-wrapper'>
<div class='swiper-slide'>Vertical Slide</div>
<div class='swiper-slide'>
<div class='swiper-container swiper-container-h'>
<div class='wrapper'>
<div class='swiper-slide'>Horizontal Slide1</div>
<div class='swiper-slide'>Horizontal Slide2</div>
<div class='swiper-slide'>Horizontal Slide3</div>
</div>
<div class='swiper_pagination swiper-pagination-h'></div>
</div>
</div>
<div class='swiper-slide'>Vertical Slide2</div>
<div class='swiper-slide'>Vertical Slide3</div>
</div>
<-- add pagination-->
<div class='swiper_pagination swiper-pagination-v'></div>
</div>
4、導入swiper的js文件 並對swiper進行設置
<script src="../dist/js/swiper.min.js"></script>
<script>
var swiperV = new Swiper('.swiper-container-v',{
pagination:'.swiper-pagination-v',
paginationClickable:true, #表示該分頁器可以點擊
direction:'vertical', #設置滾動方向，默認H
spaceBetween:50 #設置滾動速度
});
var swiperH = new Swiper('.swiper-container-h',{
pagination:'.swiper-pagination-h',
paginationClickable:true,
spaceBetween:50
});
</script>
完成！