微信小程序滑动选择器的实现代码
作者:luozx207 时间:2024-05-09 10:34:48
本文介绍了微信小程序滑动选择器的实现代码,分享给大家,具体如下:
实现微信小程序滑动选择效果
在wxml文件中,用一个picker标签代表选择器,bindchange是用户点击确定后触发的函数,index是picker自带的参数,用户点击确定后,bindchange绑定的函数用.detail.value就可以访问到。第一个选择的index值为0,依次递增。range要在page的data中先定义一个数组给它赋值,然后数组的值就会变为选择器中的选项
<picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">
<view class='choseQuestion' >
{{choseQuestionBank}}
</view>
</picker>
js文件中对应的数据和函数如下
Page({
data:{
array:['全部','计算机网络','算法','数据结构','linux'],
type:0,
choseQuestionBank:"点击选择"
},
bindPickerChange: function (e) {
var that=this
console.log('picker发送选择改变,携带值为', e.detail.value)
this.setData({
type: e.detail.value,
choseQuestionBank: that.data.array[e.detail.value]
})
},
})
点击确认选择的时候,只要判断一下this.data.type的值就可以实现不同的选择了。
来源:http://www.cnblogs.com/luozx207/p/9453245.html
标签:微信小程序,滑动,选择器
0
投稿
猜你喜欢
FrontPage2002简明教程一:安装与界面
2008-08-17 11:04:00
深入浅出MySQL双向复制技术
2009-03-25 15:40:00
python使用matplotlib绘图时图例显示问题的解决
2022-11-13 16:59:47
用命令创建MySQL数据库(de1)的方法
2024-01-22 16:12:11
替换python字典中的key值方法
2022-10-20 04:03:34
Python join()函数原理及使用方法
2021-01-17 18:37:08
GO项目配置与使用的方法步骤
2024-05-22 17:45:57
Python文件的压缩与解压
2023-09-01 08:17:23
Python用来做Web开发的优势有哪些
2023-07-20 19:23:53
请问能否在ASP中调用DLL
2009-06-07 18:24:00
Python 第三方日志框架loguru使用
2022-11-09 03:33:12
Python如何通过ip2region解析IP获得地域信息
2021-08-02 12:59:04
Flash对象在(x)HTML中的格式和参数及安全性
2010-04-01 11:55:00
TensorFlow命名空间和TensorBoard图节点实例
2022-01-15 04:52:23
mysql中如何对列求和
2024-01-16 12:28:48
PHP下 Mongodb 连接远程数据库的实例代码
2024-06-05 09:22:29
Python实用技巧之利用元组代替字典并为元组元素命名
2022-08-21 19:39:42
一文详解MySQL主从同步原理
2024-01-24 03:00:59
小程序自定义弹出框效果
2023-07-02 03:47:33
keras 模型参数,模型保存,中间结果输出操作
2023-06-05 09:52:33