常用的ui组件不支持日月的这种形式,产品提成要用input框的形式来做,且对输入字符串是否符合时间格式做校验,写起来还是很麻烦的,记录一下以后备用。
<script>
/*** 校验是否是合法日期字符串* 支持格式:* 2024年4月或2024年4月28日、* 2024-4或2024-4-28、* 2024.4或2024.4.28、* 2024/4或2024/4/28、* 202404或20240428*/function isValidDateFormat(dateString) {let index = 0const regexes = [// 带分隔符/^(\d{4})([-.\/])(\d{1,2})\2(\d{1,2})$/,/^(\d{4})[-.\/](\d{1,2})$/,// 中文格式/^(\d{4})年(\d{1,2})月(\d{1,2})日$/,/^(\d{4})年(\d{1,2})月$/,// 无分隔符/^(\d{4})(\d{1,2})(\d{1,2})?$/,]for (const regex of regexes) {index++const match = regex.exec(dateString)// console.log(match)if (match) {match.splice(0, 1);// 第一个带分割符做特殊处理if(index === 1){match.splice(1, 1);}// 提取年份、月份和日(如果存在)const [yearStr, monthStr, dayStr] = match// console.log(yearStr, monthStr, dayStr)const year = parseInt(yearStr, 10)const month = parseInt(monthStr, 10)const day = dayStr ? parseInt(dayStr, 10) : 1 // 默认日为1,如果只有年月// 校验月份和日的范围if (month < 1 || month > 12) return falseif (dayStr) {// 对于有日的格式,需要校验日是否在合理范围内const daysInMonth = new Date(year, month, 0).getDate() // 获取该月有多少天if (day < 1 || day > daysInMonth) return false}// 如果所有校验都通过,则认为是有效日期return true}}// 如果没有任何正则表达式匹配,则认为是无效日期return false
}
// 常规测试
console.log('常规测试')
console.log('2024年4月',isValidDateFormat('2024年4月'))
console.log('2024年4月28日',isValidDateFormat('2024年4月28日'))
console.log('2024-4-28',isValidDateFormat('2024-4-28'))
console.log('2024.4',isValidDateFormat('2024.4'))
console.log('2024.4.28',isValidDateFormat('2024.4.28'))
console.log('2024/4',isValidDateFormat('2024/4'))
console.log('2024/4/28',isValidDateFormat('2024/4/28'))
console.log('202404',isValidDateFormat('202404'))
console.log('20240428',isValidDateFormat('20240428'))// 只有一个数字
console.log('只有一个数字')
console.log('2024年1月11日',isValidDateFormat('2024年1月11日'))
console.log('2024年11月1日',isValidDateFormat('2024年11月1日'))
console.log('2024-11-1',isValidDateFormat('2024-11-1'))
console.log('2024-1-11',isValidDateFormat('2024-1-11'))
console.log('2024-1',isValidDateFormat('2024-1'))// // 符号混合错误
console.log('符号混合错误')
console.log('2024-4/28',isValidDateFormat('2024-4/28'))
console.log('2024.4/28',isValidDateFormat('2024-4/28'))
console.log('2024-4.28',isValidDateFormat('2024-4/28'))// 月日不符合现实错误
console.log('月日不符合现实错误')
console.log('20241328',isValidDateFormat('20241328'))
console.log('20240028',isValidDateFormat('20240028'))
console.log('20240231',isValidDateFormat('20240231'))
console.log('20240132',isValidDateFormat('20240132'))
console.log('2011-2-31',isValidDateFormat('2011-2-31'))</script>