这篇文章主要介绍了微信小程序 picker-view 组件详解及简单实例的相关资料,需要的朋友可以参考下

实现效果图:

嵌入页面的滚动选择器

属性名 类型 默认值 说明
value Number Array   数组中的数字依次表示 picker-view 内的 picker-view-colume 选择的第几项(下标从 0 开始),数字大于 picker-view-column 可选项长度时,选择最后一项。
indicator-style String   设置选择器中间选中框的样式
bindchange EventHandle   当滚动选择,value 改变时触发 change 事件,event.detail = {value: value};value为数组,表示 picker-view 内的 picker-view-column 当前选择的是第几项(下标从 0 开始)

注意:其中只可放置 组件,其他节点不会显示。

picker-view-column

仅可放置于 中,其孩子节点的高度会自动设置成与picker-view的选中框的高度一致

示例代码:



 {{year}}年{{month}}月{{day}}日
 
 
 {{item}}年
 
 
 {{item}}月
 
 
 {{item}}日
 
 
登录后复制


const date = new Date()
const years = []
const months = []
const days = []

for (let i = 1990; i 

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

登录后复制

以上就是微信小程序picker-view组件详解实例代码的详细内容,更多请关注慧达安全导航其它相关文章!

点赞(0)

评论列表 共有 0 条评论

暂无评论
立即
投稿
发表
评论
返回
顶部