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

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

相关推荐
斯班奇的好朋友阿法法11 小时前
ollama离线导入大模型
服务器·前端·javascript
misty youth11 小时前
pnpm build,发生了什么
前端·electron·pnpm·build
1024小神11 小时前
kotlin安卓项目配置webview开启定位功能
前端
kyriewen11 小时前
MutationObserver:DOM界的“卧底”,暗中观察每个风吹草动
前端·javascript·面试
踩着两条虫11 小时前
VTJ.PRO 在线应用开发平台的开发者工具与代码质量
前端·vue.js·ai编程
TON_G-T11 小时前
100行实现Mini React
前端·javascript·react.js
恋猫de小郭11 小时前
2026 AI 时代下,Flutter 和 Dart 的机遇和未来发展,AI 一体化
android·前端·flutter
多行不易11 小时前
JavaScript与Sonic前端交互:构建可视化数字人生成界面
javascript·数字人·viewui·sonic
1314lay_100711 小时前
Element Plus左侧侧边栏按照屏幕宽度来确定显示和隐藏,如果太小的话,侧边栏消失,菜单会变成一个小按钮,点击按钮以模态框弹出
javascript·vue.js·elementui
看客随心12 小时前
vue + elementPlus大屏项目使用autofit做适配及注意点
前端·javascript·vue.js