使用ant设计日期控件实现控制月份

使用ant设计日期控件实现控制月份?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

<强>总体效果:

<强>展开后:

<强>选值后:

代码部分:

<强> 1,引入:

进口{DatePicker} & # 39; antd& # 39;;

<强> 2,主体部分:

出口默认类PersonInfo扩展组件{
　　构造函数(){
　　超级();//设置状态,存储日期
　　这一点。状态={
　　workMode:[& # 39;月# 39;& # 39;月# 39;],
　　workValue: [],
　　};
　　}
　　呈现(){//主体引用
　　const {RangePicker}=DatePicker;
　　回报(
　　& lt; RangePicker
　　占位符={[& # 39;开始日期& # 39;,& # 39;结束日期& # 39;]}
　　格式=癥YYY-MM"
　　值=https://www.yisu.com/zixun/{this.state.workValue}
　　模式={this.state.workMode}>//日期面板时间值改变事件
　　workHandlePanelChange=(价值、模式)=比;{
　　this.setState ({
　　workValue:值,
　　workMode:(
　　模式[0]===& # 39;日期# 39;,# 63;& # 39;月# 39;:模式[0],
　　模式[1]===& # 39;日期# 39;,# 63;& # 39;月# 39;:模式[1],
　　),
　　});
　　}//日期清空时触发
　　workOnChange=()=比;{
　　this.setState ({
　　workMode:[& # 39;月# 39;& # 39;月# 39;],
　　workValue: [],
　　}）
　　}

<强>获取日期值:

//其中this.state.workValue的两个值都是毫秒,formatDate为自写的转换函数 　　让workYearBegin=this.formatDate (this.state.workValue [0]); 　　让workYearEnd=this.formatDate (this.state.workValue [1]); 　　formatDate=(时间)=比;{ 　　如果(!){ 　　返回& # 39;& # 39;; 　　} 　　让日期=new日期(时间);//毫秒转换成日期 　　让年=date.getFullYear (); 　　让月=(date.getMonth () + 1) .toString () .padStart(2, & # 39; 0 & # 39;);//月份不足两位数在前面补0 　　返回年+ & # 39;& # 39;+月;//格式控制 　　}

<>强eact使用ant时设置DatePicker日期控件中文显示

方式一:局部设置

 
方式二:全局设置
 
从& # 39;进口时刻时刻# 39;;
　　进口& # 39;时刻/地区/应用# 39;;
　　moment.locale(& # 39;应用# 39;);
 
关于使用ant设计日期控件实现控制月份问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注行业资讯频道了解更多相关知识。
使用ant设计日期控件实现控制月份