获取本日本周本月本年附带vue示例

在项目中经常会遇到对时间的快捷选择，所以查找资料终结了一下以便后续使用，并提供了elemet-ui的示例。 

一、获取本日

//获取本日
const startDate = moment().format('YYYY-MM-DD');
const endDate = moment().format('YYYY-MM-DD');

// js 方法
const startData = new Date();
const endData = new Date();

二、获取本周 

//获取本周
const startWeek = moment().week(moment().week()).startOf('week').format('YYYY-MM-DD'); //这样是年月日的格式
const endWeek = moment().week(moment().week()).endOf('week').format('YYYY-MM-DD');
// const endWeek = moment().week(moment().week()).endOf('week').valueOf(); //这样是时间戳的格式

// js 获取本周最后一天是当天，后面日期没到，没有意义获取
let endWeek = new Date();
let nowYear = end.getFullYear(); // 当前年
let nowMonth = end.getMonth(); // 当前月
let nowDay = end.getDate(); // 当前日
let nowDayOfWeek = end.getDay(); // 今天本周的第几天
let day = nowDayOfWeek || 7;
let startWeek = new Date(nowYear, nowMonth, nowDay + 1 - day);

三、获取本月 

//获取本月 
const startMonth = moment().month(moment().month()).startOf('month').format('YYYY-MM-DD');
const endMonth = moment().month(moment().month()).endOf('month').format('YYYY-MM-DD');

//js 获取本月
let endMonth = new Date();
let nowYear = endMonth.getFullYear(); // 当前年
let nowMonth = endMonth.getMonth(); // 当前月
let startMonth = new Date(nowYear, nowMonth, 1);

四、获取本年 

//获取本年
const startYear = moment().year(moment().year()).startOf('year').format('YYYY-MM-DD');
const endYear = moment().year(moment().year()).endOf('year').format('YYYY-MM-DD');

//js 获取本年
const endYear = new Date();
const startYear = new Date(endYear.getFullYear(), 0);

五、vue、elemet-ui的示例

<template>
  <el-date-picker
    v-model="timeValue"
    value-format="yyyy-MM-dd"
    format="yyyy-MM-dd"
    unlink-panels
    class="time-range"
    type="daterange"
    range-separator="至"
    start-placeholder="开始日期"
    end-placeholder="结束日期"
    :picker-options="pickerOptions"
  >
  </el-date-picker>
</template>

<script>
import moment from "moment";
const startYear = new Date(
  moment().year(moment().year()).startOf("year").format("YYYY-MM-DD")
);
const startMonth = new Date(
  moment().month(moment().month()).startOf("month").format("YYYY-MM-DD")
);
const startWeeK = new Date(
  moment().week(moment().week()).startOf("week").format("YYYY-MM-DD")
);
const newDay = new Date();
export default {
  data() {
    return {
      // 日期扩展
      pickerOptions: {
        shortcuts: [
          {
            text: "今日",
            onClick(picker) {
              picker.$emit("pick", [newDay, newDay]);
            },
          },
          {
            text: "本周",
            onClick(picker) {
              picker.$emit("pick", [startWeeK, newDay]);
            },
          },
          {
            text: "本月",
            onClick(picker) {
              picker.$emit("pick", [startMonth, newDay]);
            },
          },
          {
            text: "全年",
            onClick(picker) {
              picker.$emit("pick", [startYear, newDay]);
            },
          },
        ],
      },
      timeValue: "",
    };
  },
};
</script>