如何使用微信小程序的滑动选择器？

  如何使用微信小程序的滑动选择器?想知道答案的小伙伴就赶紧看过来吧，下面就是小编给大家带来的方法。

 组件说明:

  滑动选择器。

  组件用法：

  wxml

  <view class="section section_gap">

  <text class="section__title">设置left/right icon</text>

  <view class="body-view">

  <slider bindchange="slider1change" left-icon="cancel" right-icon="success_no_circle"/>

  </view>

  </view>

  <view class="section section_gap">

  <text class="section__title">设置step</text>

  <view class="body-view">

  <slider bindchange="slider2change" step="5"/>

  </view>

  </view>

  <view class="section section_gap">

  <text class="section__title">显示当前value</text>

  <view class="body-view">

  <slider bindchange="slider3change" show-value/>

  </view>

  </view>

  <view class="section section_gap">

  <text class="section__title">设置最小/最大值</text>

  <view class="body-view">

  <slider bindchange="slider4change" min="50" max="200" show-value/>

  </view>

  </view>

  复制代码

  js

  var pageData = {}

  for (var i = 1; i < 5; i++) {

  (function (index) {

  pageData[\'slider\' + index + \'change\'] = function(e) {

  console.log(\'slider\' + \'index\' + \'发生 change 事件，携带值为\', e.detail.value)

  }

  })(i)

  }

  Page(pageData)

  复制代码

  wxss

  .page {

  min-height: 100%;

  flex: 1;

  background-color: #FBF9FE;

  font-size: 32rpx;

  overflow: hidden;

  }

  复制代码

 以上就是如何使用微信小程序的滑动选择器的全部内容了，大家都学会了吗?