Ant Design实现月份选择

最新推荐文章于 2024-08-05 23:30:12 发布

焦杨2019

最新推荐文章于 2024-08-05 23:30:12 发布

阅读量4k

点赞数 2

本文链接：https://blog.csdn.net/weixin_45344873/article/details/100121400

版权

本文介绍如何在Ant Design 3.x版本中，由于缺少MonthRangePicker组件，通过mode和onPanelChange方法自定义实现月份选择功能。详细讨论了mode的定义和使用，以及在表单中使用时需要注意的onPanelChange回调，特别是如何避免日期选择的异常问题，并给出了代码实现和打印结果。

摘要由CSDN通过智能技术生成

Ant Design实现月份选择

背景

需求：在调拨管理模块下的在途数据详情，需要按月搜索数据。
问题点：在ANTD3.X版本中，没有MonthRangePicker，需要自己利用 mode 和 onPanelChange 方法封装一个 MonthRangePicke 组件
实现后截图：

利用 mode 和 onPanelChange 方法封装一个 MonthRangePicke 组件

实现代码

	<FormItem
	    label="月份:"
	    style={
   {
    display: 'inline-block' }}
	>
	    {
   getFieldDecorator('reportMonth', {
   
	        initialValue: [moment().subtract(1,<