zoukankan      html  css  js  c++  java
  • Vue element-ui 限制时间范围选择

    <el-date-picker type="datetimerange" v-model="datetime" :picker-options="pickerOptions" start-placeholder="开始日期" end-placeholder="结束日期" />
    
    data() {
      return {
        datetime: "",
        pickerOptions: {
    
            shortcuts: ((end) => {
              return [
                {
                  text: "这周",
                  onClick(picker) {
                    const start = end.weekday(0).startOf("day");
                    const range = [start.format(), end.format()];
                    picker.$emit("pick", range);
                  },
                },
                {
                  text: "这个月",
                  onClick(picker) {
                    const start = end.startOf("M");
                    const range = [start.format(), end.format()];
                    picker.$emit("pick", range);
                  },
                },
                {
                  text: "最近三个月",
                  onClick(picker) {
                    const start = end.subtract(2, "M").startOf("M");
                    const range = [start.format(), end.format()];
                    picker.$emit("pick", range);
                  },
                },
              ];
            })(dayjs()),
    
            disabledDate: ((start, end) => {
              return (date) => {
                return !dayjs(date).isBetween(start, end, "day", "[]");
              };
            })(
              dayjs().subtract(1, "M").startOf("M"),
              dayjs()
            ),
    
          }
      }
    }
    

  • 相关阅读:
    Java 条件语句
    Java循环
    Java 变量
    Java 数据类型
    nginx+php发布网站
    安装MySQL5.7
    docker-compose参数
    部署
    dockerfile编写
    在VMware中安装CentOS7
  • 原文地址:https://www.cnblogs.com/ajanuw/p/15271989.html
Copyright © 2011-2022 走看看