本文介绍了如何在微信小程序中实现下拉框选项，包括使用picker组件和自定义select组件的方法。提供了示例代码和事件处理，展示了一个简单的下拉列表选项的显示、隐藏以及选中值的更新。还附带了一个获取时间分割数组的辅助函数。
写小程序时候，经常遇到使用下拉框选项，不过每次都手写很麻烦，所有我就发一个例子吧，因为我包在其他模块中，所有样式不知道有没有复制全，大家见谅！
小程序也有一个选项组件：picker 这个非常好用， 现在基本都用这个了。挺不错。后来我才发现的。
·
好了，不啰嗦，如下：
image.png
image.png
image.png
每一个值的高度等你们可以随意设置，看个人喜好。
变量解释：
这个原理很简单，首先准备一些标签，准备一张图片(展开与折叠用)，数据绑定就不说了。
设置变量：selectShow， 控制下拉框列表是否显示隐藏，我设置的是高度，显示就设置高度，不显示就设置为0； index，设置显示第几个数据，默认可以设置为0，根据需求； selectData，你要选择的数据组[]；
js事件：
当点击三角时候，设置下拉框option选项显示(高度)。当点击选项值的时候，设置全局变量的下标值，标签中会根据下标在数组中选中，绑定数据显示， 然后设置下拉框option选项不显示(高度0)。
Page({
最低0.47元/天 解锁文章
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
