小程序导航栏全屏navigationStyle自定义导航栏，小程序轮播图导航栏

  <!-- swiper -->
    <view class="page-section page-section-spacing swiper">
      <swiper indicator-dots="{{indicatorDots}}"
        autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
        <block wx:for="{{background}}" wx:key="key">
          <swiper-item>
            <view class="swiper-item">
              <image src="{{ item.url }}"></image>
            </view>
          </swiper-item>
        </block>
      </swiper>
    </view>
  </view>
1
2
3
4
5
6
7
8
9
10
11
12
13
14

css

.swiper{
position: fixed;
width: 750rpx;
height: 422rpx;
}
swiper{
height: 422rpx;
}

js

  data: {
    background: [{
      key: 1,
      url: '../../../images/banner.png'
    }, {
      key: 2,
      url: '../../../images/banner.png'
    }, {
      key: 3,
      url: '../../../images/banner.png'
    }, {
      key: 4,
      url: '../../../images/banner.png'
    }],
    
    })
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

json重点
"navigationStyle": "custom"
如果轮播样式在所有页面都有就放到app.json中，只有某一个页面有就单独放在那个文件下
效果

欢迎大家互相交流