React 在使用antd的RangePicker时,解决季度选择不是按照当前季度的第一天显示问题
首先声明一下我使用的是 "antd": "^5.22.7", "react": "^18.3.1",
这个是查询错误的时间,应该显示开始时间是2025-01-01,结束时间是2025-09-30
原因是
dayjs 的 startOf 方法未生效,这通常是由于 缺少必要的插件 导致的。startOf(‘quarter’) 需要 quarterOfYear 插件支持,需要加入代码
import dayjs from 'dayjs';
import quarterOfYear from 'dayjs/plugin/quarterOfYear';
季度查询代码不需要改
quarter: {label: '按季度查询',picker: 'quarter',format: 'YYYY-[Q]Q',handleResult: (dates) => {if (!dates || !dates[0] || !dates[1]) {return { start: '', end: '' };}try {const start = dates[0].clone().startOf('quarter').format('YYYY-MM-DD');const end = dates[1].clone().endOf('quarter').format('YYYY-MM-DD');return {start,end,};} catch (error) {console.error('季度处理错误:', error);return { start: '', end: '' };}},},
最后的结果是这样的