小程序之滑动选择器

小俊的碍着你了

于 2021-04-13 11:18:53 发布

阅读量196

点赞数

分类专栏：笔记文章标签：小程序

本文链接：https://blog.youkuaiyun.com/weixin_47779182/article/details/115658198

版权

笔记专栏收录该内容

32 篇文章

订阅专栏

本文介绍了如何在微信小程序的WXML文件中使用滑动选择器slider，并展示了其基本配置如minValue、maxValue和value的设置。重点讲解了sliderchange事件的使用，通过该事件实现滑动值实时更新textValue的示例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

滑动选择器

slider 滑动选择器。

wxml

 <view>
    <label class="title col-0">幸福指数：{{textValue}}</label>
    <view class="intro">
      <slider bindchange="sliderchange" min="{{minValue}}" max="{{maxValue}}" value="{{showValue}}" show-value/>
    </view>
  </view>

data: {
	minValue: '0',
    maxValue: '100',
    showValue: '30',
    textValue: '30',
}
sliderchange: function (e) {
	conslone.log(e.detail.value)
    this.setData({
      textValue: e.detail.value
    })
  },