测试同学说想要有个季度的预设选择框,方便快速选择季度的开始和结束日期。
antd 的rangepicker是支持预设的
日期选择框 DatePicker - Ant Design
实现方法很简单,按照官网示例用moment初始化一下即可
获取当前一季度的开始日期时间: moment().quarter(1).startOf('quarter')
const seasons = {};
Array(4).fill(1).map((_,index)=>{
const i = index+1;
seasons[`Q${i}`] = [moment().quarter(i).startOf('quarter'), moment().quarter(i).endOf('quarter')]
})
组件使用:
<RangePicker
ranges={seasons} />
效果:文章来源:https://www.toymoban.com/news/detail-822914.html
文章来源地址https://www.toymoban.com/news/detail-822914.html
到了这里,关于antd 日期选择框增加季度预设范围的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!