【react+antd使用RangePicker日期选择组件显示中文方案】1.开发环境 react
2.电脑系统 windows11专业版
3.废话不多说,直接上代码:
// 有效的配置 : 可以显示为中文
关键代码
// 需要导入
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.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰。