react+antd使用RangePicker日期选择组件显示中文方案

1.开发环境 react
2.电脑系统 windows11专业版
3.废话不多说,直接上代码:

// 有效的配置 : 可以显示为中文 
<RangePicker picker="month" onChange={dateChange} /> 关键代码

// 需要导入
import 'moment/locale/zh-cn';//解决中文显示问题 !!!关键代码

//效果如下图

4.不可选日期

/* 日 不可选日期 */
  const dayDisabledDate=(current)=> {
     // // 限制为前后31天
     return current < moment().subtract(31, "days") || current > moment().add(31, 'days')
  }

4-1.效果如下:

5.扩展:

// 月 不可选日期
    const MonthDisabledDate=(current)=> {
        // // 限制为前后一周
        // return current < moment().subtract(7, "days") || current > moment().add(7, 'days')
        // 限制为前后一周
        // return current < moment().subtract(1, "weeks") || current > moment().add(1, 'weeks')
        // 限制为前后一月
        // return current < moment().subtract(1, "months") || current > moment().add(1, 'months')
        // 限制为前后一年
        // return current < moment().subtract(1, "years") || current > moment().add(1, 'years')

        // // 限制为前后12月
        return current < moment().subtract(12, "months") || current > moment().add(12, 'months')
    }

6.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。