slider 是微信小程序中的一个表单组件,它用于允许用户通过滑动手势选择范围内的数值。以下是一个基本的 slider 示例:
<view class="container">
  <slider value="{{sliderValue}}" bindchange="sliderChange" show-value min="0" max="100" />
  <text>当前值:{{sliderValue}}</text>
</view>

在对应的 .js 文件中,你需要定义 sliderValue 和 sliderChange 函数:
Page({
  data: {
    sliderValue: 50,
  },

  sliderChange: function (e) {
    const value = e.detail.value;
    this.setData({
      sliderValue: value,
    });
  },
});

在这个示例中,slider 组件的 value 属性表示当前数值,通过 bindchange 绑定了 sliderChange 函数,当用户滑动选择后,会触发这个函数。在 sliderChange 函数中,通过 e.detail.value 获取滑动后的数值,并将其更新到 sliderValue 中,以便在页面上反映当前选择的数值。

你可以根据实际需求调整 slider 的属性,如 min 和 max 用于设置滑动范围的最小和最大值,show-value 用于显示当前数值,等等。这个组件通常用于需要用户选择一个范围值的场景。


转载请注明出处:http://www.zyzy.cn/article/detail/809/微信小程序