js获取下个月的月份，自定义日历禁用时间

最新推荐文章于 2024-09-12 09:25:11 发布

棉花一朵

最新推荐文章于 2024-09-12 09:25:11 发布

阅读量1.8k

点赞数 1

文章标签： javascript 前端

本文链接：https://blog.youkuaiyun.com/weixin_53125679/article/details/127646562

版权

本文介绍JavaScript中正确获取下个月月份的方法，并提供了一个自定义日历组件的禁用日期功能实现，确保用户只能选择当前或下个月的日期。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

js获取下个月的月份

获取下个月的月份时，要先获取此时月份的第一天，因为月的天数不一，直接获取下个月可能会导致获取到下下个月的情况。
例如，在本月31号获取的时间上加一个月，获取的是下个月的31号，如果下个月只有30天，则获取到的是下下个月的一号，获取下个月月份就会出错。

const time1 = new Date()
const time2 = new Date()
time2.setDate(1)    //设置成月的第一天
time2.setMonth(time2.getMonth()+1)   //将月份变成下个月
//获取月份是0-11，所以要加1
time1.getMonth()+1  //获取到的是本月的月份
time2.getMonth()+1  //获取到的是下月的月份

自定义日历禁用时间，只能选本月

const disabledDate = (current) => {
    const month=this.props.location?.state?.month||localStorage.getItem('month') //'2022-11-01'
    const time=moment(new Date()).format(formatDay)//当前月份  '2022-10-27'
    const time2 = new Date()
    time2.setDate(1)  //下个月的第一天
    time2.setMonth(time2.getMonth()+1)

    //---分割
    let month1 = month.split("-");
    let month2 = time.split("-");

    if(month1[1]==month2[1]){
        // 只能选择本月
        return moment().startOf('month')>current|| current>=moment().endOf('month');
    }{
        //只能选择下个月
        return moment(time2).startOf('month')>current|| current>=moment(time2).endOf('month');
    }
    
};

 disabledDate(current) {
        // Can not select days before today
        return current && current < moment()
            .startOf('day');
        // Can not select days before today and today
        // return current && current < moment().endOf('day');
    }



<RangePicker
 placeholder={['开始时间','结束时间']}
    disabledDate={disabledDate}
    style={{width:"500px"}}
    value={isEmpty(item.start_time) ? undefined : [moment(item.start_time), moment(item.end_time)]}
    onChange={(e) => this.change('monthPicker','plan_datestr', e,index)}
/>