【uniapp/uview】u-datetime-picker 选择器的过滤器用法

引入:要求日期选择的下拉框在分钟显示时,只显示 0 和 30 分钟;

html 复制代码
<u-datetime-picker :show="dateShow" :filter="timeFilter" @confirm="selDateConfirm" @cancel="dateCancel" v-model="value1" mode="datetime"></u-datetime-picker>

这里引入了 filter = "timeFilter" 作为其配置项;

javascript 复制代码
timeFilter(mode, options) {
            console.log(mode);
            let d = new Date()
            // console.log(d.getFullYear());
            if(mode === 'year'){
                return options.filter((option)=>option>= d.getFullYear())
            }
            if(mode === 'month'){
                return options.filter((option)=>option>= d.getMonth()+1)
            }
            if (mode === 'minute') {
                return options.filter((option) => option === '00' || option === '30');
            }
            return options;
        },

还补充了开始年份从今年开始的写法,这样就可以按照要求来自定义了。

相关推荐
mewowaBc4 分钟前
使用Pinia持久化存储实现用户认证系统
vue·pinia·用户认证系统
陈随易6 分钟前
副业搞钱点子之赛事与活动
前端·后端·程序员
电梯界知识分子8 分钟前
景德镇老房重新设计阶段规划楼梯与电梯,1.7m×1.6m空间装400kg观光电梯,棕色框架茶色玻璃适配中式装修
大数据·服务器·前端·网络·家用电梯
Shell运维手记17 分钟前
Shell 脚本入门课堂讲解
前端·chrome
Profile排查笔记21 分钟前
有哪些开源指纹浏览器项目?先核对客户端、内核与许可证
前端·人工智能·后端·自动化
CodeGL26 分钟前
16、Python Web开发
开发语言·前端·python
FRing0333 分钟前
JavaScript入门到精通二十九(内置构造函数(Object、Array))
开发语言·前端·javascript
AAA程序技术38 分钟前
从 DOM 到屏幕:浏览器渲染管线六步拆解
前端·浏览器
zach39 分钟前
useContext 深入讲解:组件透传、原理与最佳实践
前端
张一凡931 小时前
AI 改完代码,人却不知道它改了什么:架构漂移才是真正的成本
前端·后端·agent