小程序picker的使用
效果图:

代码:
<view class='infoItem'>
<view class='infoItem-left'><text style='color:red'>*</text>出厂时间</view>
<view class='infoItem-right'>
<picker mode="date" start="1900-01-01" end="{{currentTime}}" value="{{deliveryTime}}" bindchange="bindDateChange">
<view style='color:#666;padding:10rpx 0 10rpx 20rpx'>{{deliveryTime}}</view>
</picker>
</view>
</view>
.infoItem{
display: flex;
border-bottom:2rpx solid #f2f2f2;
padding:10rpx 0;
}
.infoItem-left{
width: 220rpx;
padding: 10rpx 0
}
.infoItem-right{
flex: 1;
background: #f2f2f2;
border-radius: 10rpx;
font-size: 30rpx
}
.infoItem-right>input{
padding:10rpx 0 10rpx 20rpx;
color: #666
}
const app = getApp()
var timestamp = Date.parse(new Date());
var date = new Date(timestamp);
//获取年份
var Y = date.getFullYear();
//获取月份
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
//获取当日日期
var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
var currentTime = Y + '-' + M + '-' + D Page({ /**
* 页面的初始数据
*/
data: {
currentTime, //不能超过当前时间
deliveryTime: '请选择',//出厂时间 date },
/**
* 出厂时间
*/
bindDateChange(e) {
this.setData({
deliveryTime: e.detail.value
})
console.log(e.detail.value)
}, }
小程序picker的使用的更多相关文章
- 微信小程序picker组件两列关联使用方式
在使用微信小程序picker组件时候,可以设置属性 mode = multiSelector 意为多列选择,关联选择,当第一列发生改变时侯,第二列甚至第三列发生相应的改变.但是官方文档上给的只 ...
- 微信小程序picker组件关于objectArray数据类型绑定
一.前言: 我发现很多的同学都在抱怨说微信小程序的picker的mode = selector/mode = multiSelector 无法实现Object Array数据类型的绑定,其实很多人就想 ...
- 微信小程序——picker通过value返回你想获取的值
关于微信小程序中的picker使用方法可以访问:picker-小程序 从它的官方文档中,可以看出它返回的value值是它range的下标: 在项目中,我们大多数时候传的值并不是需要这个下标,而是其他的 ...
- 微信小程序—picker(滚动选择器)
官方api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/picker.html 上边是官网的api.小程序中,底部下拉滚动选择主要有这几种 ...
- 微信小程序picker重写,精确到时分秒
https://developers.weixin.qq.com/miniprogram/dev/component/picker.html 微信小程序提供的picker组件,只精确到分,项目中需要秒 ...
- mpvue + 微信小程序 picker 实现自定义多级联动 超简洁
微信小程序官网只提供了省市区的三级联动,实际开发中更多的是自定义的多级联动: 依照微信小程序官网提供的自定义多级联动,需要使用到picker 的多列选择器,即设置 mode = multiSelect ...
- 关于小程序picker 的使用
前言 以前做小程序的时候只会用那个picker mode = region的 3级选中, 现在需要自己根据后台给的编号省市区来用然后就研究了多列选择器:mode = multiSelector 的用法 ...
- 小程序picker地区级联选择的问题及解决方案
各种系统中行政区域选择的场景不少,我们也有不少这样的场景.本想使用第三方的组件,但是大多有些小问题,不能满足需要.后面使用picker的mulitSelector模式写了一个,发现这种列模式的体验并好 ...
- 小程序 picker 多列选择器 数据动态获取
需求是将各校区对应各班级的数据 以两列选择器的方式展示出来,并且可以在选择完成之后记录选结果参数. 校区数据 和 班级数据 分别是两个接口,以 校区 teach_area_id 字段关联 其各班级数据 ...
- 微信小程序 picker 中range-key的坑
<picker class='fr' bindchange="onChangeBuild" range-key="{{'num'}}" value=&qu ...
随机推荐
- 服务端&客户端注册进Eureka
目录 服务端(接口提供方) 创建项目 导入Eureka客户端POM 启动类添加注解 配置YML 暴漏接口 启动服务 集群 配置成功后页面如下 客户端(接口调用方) 修改Yml文件 配置类 启动类添加注 ...
- 15、mysql主从复制的原理
mysql主从复制 要想实现mysql的主从复制需要先了解二进制日志(bin log)和中继日志(relay log). 二进制日志(bin log) binlog即binary log,二进制日志文 ...
- LGP5493题解
卡完常后来造福一下人类 如何从4.80s卡到920ms.jpg 本题解的复杂度为 \(O(\frac {n^{3/4}} {\log n})\),然而标算是 \(O(\frac {n^{2/3}} { ...
- NET经典书籍必读
C#与.NET框架,入门 + 进阶 + 精通,外加并发编程实例,10本C#图书,一本都不能少. 1.<Learning hard C#学习笔记> 作者:李志 书号:978-7-115-3 ...
- Windows10 1809版本Windows自动更新服务无法禁用问题解决方案
症状 Windows Update服务已经在服务管理器中禁用,但是莫名奇妙的会被自动设置为手动,并会自动下载补丁.原因 微软加强了系统更新服务的保护措施,导致按照原有的禁用服务方法,能够随时被恢复.解 ...
- 程序设计基础·Java学习笔记·面向对象(下)
Java程序设计基础之面向对象(下) (补充了上的一些遗漏的知识,同时加入了自己的笔记的ヾ(•ω•`)o) (至于为什么分P,啊大概是为了自己查笔记方便(?)应该是("` 3′") ...
- kubernetes修改ingress默认端口
kubectl edit daemonset nginx-ingress-controller -n ingress-nginx containers: - args: - /nginx-ingres ...
- JSON.parse()和JSON.stringfy()区别
JSON.parse() 用于从一个json格式字符串解析出json类型的数据,如: 注意事项:json格式字符串必须是写在一排的,且括号外面用单引号,里面的每一个字符串用双引号 JSON.strin ...
- ZYNQ SGI、PPI、SPI三种中断的实例(含代码)
ZYNQ中断分为3类: SGI(Software Generated Interrupts)软件中断 PPI(Private Peripheral Interrupts)私有外设中断 SPI(Shar ...
- json.dumps参数之解
宝藏参数,懂的都懂^-^ 说明:编译后print()打印内容,此内容以字符串紧凑输出,且无顺序,中文不可读.. 应用:使用pycharm做接口测试时,print()打印出的接口下行,如下图: ...