美文网首页需要近期研究的项目
iview DatePicker 限制只能选本月

iview DatePicker 限制只能选本月

作者: 新苡米 | 来源:发表于2022-01-10 11:33 被阅读0次

    HTML:

    <FormItem label="活动时间" prop="activity_time">
                        <DatePicker
                          v-model="addForm.activity_time"
                          @on-change="param.activity_time=$event"
                          type="date"
                          format="yyyy-MM-dd"
                          :options="options"
                          placeholder="活动时间"
                          style="width: 214px"
                          :disabled="modalDisable"
                        ></DatePicker>
                      </FormItem>
    

    JS:

    options: {
            disabledDate(date) {
              let dateTime = new Date();
              let currentYear = dateTime.getFullYear();
              let currentMonth = dateTime.getMonth();
              let monthFirstDay = new Date(currentYear, currentMonth, 1);
    
              let newMonth = ++currentMonth;
              let newYear = currentYear;
              if (newMonth >= 12) {
                newMonth -= 12;
                newYear++;
              }
              let nextMonthFirst = new Date(newYear, newMonth, 1);
              let nonthLastDay = new Date(
                nextMonthFirst.getTime() - 24 * 60 * 60 * 1000
              );
              return (
                date.valueOf() < new Date(monthFirstDay).getTime() ||
                date.valueOf() > new Date(nonthLastDay).getTime()
              );
            }
          } //时间范围限制
    

    扩展:
    一些时间格式的转换与时间的获取

    var myDate = new Date();  
    myDate.getYear(); //获取当前年份(2位)  
    myDate.getFullYear(); //获取完整的年份(4位,1970-????)  
    myDate.getMonth(); //获取当前月份(0-11,0代表1月)         // 所以获取当前月份是myDate.getMonth()+1;   
    myDate.getDate(); //获取当前日(1-31)  
    myDate.getDay(); //获取当前星期X(0-6,0代表星期天)  
    myDate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)  
    myDate.getHours(); //获取当前小时数(0-23)  
    myDate.getMinutes(); //获取当前分钟数(0-59)  
    myDate.getSeconds(); //获取当前秒数(0-59)  
    myDate.getMilliseconds(); //获取当前毫秒数(0-999)  
    myDate.toLocaleDateString(); //获取当前日期  
    var mytime=myDate.toLocaleTimeString(); //获取当前时间  
    myDate.toLocaleString( ); //获取日期与时间  
    

    JS获取当前时间戳的方法-JavaScript 获取当前毫秒时间戳有以下三种方法

    var timestamp =Date.parse(new Date());    结果:1280977330000       //不推荐; 毫秒改成了000显示  
     
    var timestamp =(new Date()).valueOf();       结果:1280977330748       //推荐;   
     
    var timestamp=new Date().getTime();         结果:1280977330748        //推荐;  
    

    限制只能选本月以及以后的

    disabledDate(date) {
              let nowTime = new Date();
              let month = nowTime.getMonth() + 1;
              let year = nowTime.getFullYear();
              if (month - 1 == 0) {
                year = year - 1;
                month = 12;
              }
              return date && date.valueOf() < (new Date(`${year}-${month}`) - 28800000);
     },
    

    参考
    https://blog.csdn.net/zwt_guiji/article/details/80258944

    相关文章

      网友评论

        本文标题:iview DatePicker 限制只能选本月

        本文链接:https://www.haomeiwen.com/subject/qrsmcrtx.html