【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;
        },

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

相关推荐
竹林8181 分钟前
在Next.js NFT市场中,我如何解决动态路由、链上数据获取与状态同步的连环坑
前端·javascript·next.js
mit6.82415 分钟前
GeekDoc
html
用户693717500138417 分钟前
实测!Gemma 4 成功跑在安卓手机上:离线 AI 助手终于来了
android·前端·人工智能
大阿明17 分钟前
使用vite打包并部署vue项目到nginx
前端·vue.js·nginx
小江的记录本22 分钟前
【Swagger】Swagger系统性知识体系全方位结构化总结
java·前端·后端·python·mysql·spring·docker
用户4450666087623 分钟前
领域模型 DSL 设计
前端
csdn_aspnet24 分钟前
如何在 .NET Core WebAPI 和 Javascript 应用程序中安全地发送/接收密钥参数
javascript·.netcore·cryptojs
画画的阿飞25 分钟前
里程碑一:基于 node.js 实现 BFF 层服务端内核过程总结
前端
用户81135818812028 分钟前
【AJAX-Day2】Promise与回调地狱
前端·ajax
Moshow郑锴28 分钟前
npm国内镜像加速之使用 nrm 工具(灵活切换,适合多环境)
前端·npm·node.js