格式化日期（中国标准时间）

格式化前：

 

 格式化后：

 

 

这里借助element-ui的日期选择器进行操作，简单的页面如下：

 

 

<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">

    <div class="block">
      <span class="demonstration">日期选择:</span>
      <el-date-picker
          v-model="dateStr"
          type="daterange"
          align="right"
          unlink-panels
          @change="getTime"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions">
      </el-date-picker>
      </div>
  </div>
</template>

　　data数据

data() {
    return {
      dateStr: "",
      pickerOptions: {
        shortcuts: [{
                    text: '本月',
                    onClick(picker) {
                        let end = new Date();
                        let start = new Date();
                        start.setDate(1);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '上月',
                    onClick(picker) {
                        let oDate = new Date();
                        let year = oDate.getFullYear();
                        let month = oDate.getMonth();
                        let start, end;
                        if (month == 0) {
                            year--
                            start = new Date(year, 11, 1)
                            end = new Date(year, 11, 31)
                        } else {
                            start = new Date(year, month - 1, 1)
                            end = new Date(year, month, 0);
                        }

                        picker.$emit('pick', [start, end]);
                    }
                }]
      },
      startDateStr: '',
      endDateStr: '',
    };
  },

　　methods

methods: {
    getTime() {
      console.log('------格式前--------');
      console.log(this.dateStr);
      
      // 调用格式化方法
      this.startDateStr = this.formatDate(this.dateStr[0])
      this.endDateStr = this.formatDate(this.dateStr[1])

      console.log('------格式后--------');
      console.log(this.startDateStr,this.endDateStr);
    },
    // 转换日期格式
    formatDate(dateTime) {
        let date = new Date(dateTime);
        let YY = date.getFullYear() + '-';
        let MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        let DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
        let hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
        let mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
        let ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
        return YY + MM + DD + " " + hh + mm + ss;
    },
  },

　　大功告成！再根据需要截取格式化后的日期即可。