Vue获取当前日期的方法

一、Vue获取当前日期时间

在Vue中获取当前日期时间可以使用Date对象，Date对象可以获取当前日期和时间。代码示例如下：


new Date();

上述代码将返回当前的日期和时间。如果想获取格式化后的日期和时间，需要使用toLocaleString()方法进行格式化，代码示例如下：


new Date().toLocaleString();

上述代码将返回格式化后的日期和时间，如"2022/2/14 下午3:46:37"。

二、Vue获取当前年月日

Vue获取当前年月日也可以使用Date对象，可以使用getFullYear()、getMonth()、getDate()方法分别获取年、月、日。代码示例如下：


var today = new Date();
var year = today.getFullYear();//获取年份
var month = today.getMonth() + 1;//获取月份
var day = today.getDate();//获取日期
console.log(year + "-" + month + "-" + day);

上述代码将返回当前的年月日，如"2022-2-14"。

三、Vue获取前一天日期

Vue获取前一天日期需要先获取当前日期，然后减去一天的时间戳，最后转化为日期格式。代码示例如下：


var today = new Date();
var yesterday = new Date(today.getTime() - 24 * 60 * 60 * 1000);
console.log(yesterday.getFullYear() + "-" + (yesterday.getMonth() + 1) + "-" + yesterday.getDate());

上述代码将返回前一天的日期，如"2022-2-13"。

四、Vue每秒获取系统当前时间

Vue每秒获取系统当前时间可以使用setInterval()方法，每秒钟刷新一次时间。代码示例如下：


var time = new Vue({
  el: '#time',
  data: {
    nowTime: ''
  },
  created: function () {
    setInterval(() => {
      this.nowTime = new Date().toLocaleString()
    }, 1000)
  }
})

上述代码将每秒钟更新一次nowTime的值，从而达到实时更新时间的效果。

五、Vue如何获取当前时间

Vue如何获取当前时间同样可以使用Date对象，可以使用getTime()方法获取当前时间距离1970年1月1日的时间戳，然后再转化为日期格式。代码示例如下：


var time = new Vue({
  el: '#time',
  data: {
    nowTime: ''
  },
  created: function () {
    this.nowTime = new Date(parseInt(new Date().getTime())).toLocaleString()
  }
})

上述代码将返回当前的时间，如"2022/2/14 下午3:46:37"。

六、Vue获取当前日期yyyymmdd

Vue获取当前日期yyyymmdd可以使用Date对象，可以使用getFullYear()、getMonth()、getDate()方法分别获取年、月、日，然后将月份和日期转化为两位数。代码示例如下：


var today = new Date();
var year = today.getFullYear();
var month = today.getMonth() + 1;
var day = today.getDate();
if (month < 10) {
  month = "0" + month;
}
if (day < 10) {
  day = "0" + day;
}
console.log(year + "" + month + "" + day);

上述代码将返回当前的时间，如"20220214"。

七、Vue获取当前日期前一天

Vue获取当前日期前一天同样需要先获取当前日期时间戳，然后减去一天的时间戳，最后转化为日期格式。代码示例如下：


var today = new Date();
var yesterday = new Date(today.getTime() - 24 * 60 * 60 * 1000);
var year = yesterday.getFullYear();
var month = yesterday.getMonth() + 1;
var day = yesterday.getDate();
if (month < 10) {
  month = "0" + month;
}
if (day < 10) {
  day = "0" + day;
}
console.log(year + "" + month + "" + day);

上述代码将返回前一天的日期，如"20220213"。

八、Vue获取当前日期加30天

Vue获取当前日期加30天同样需要先获取当前日期时间戳，然后加上30天的时间戳，最后转化为日期格式。代码示例如下：


var today = new Date();
var nextMonth = new Date(today.getTime() + 30 * 24 * 60 * 60 * 1000);
var year = nextMonth.getFullYear();
var month = nextMonth.getMonth() + 1;
var day = nextMonth.getDate();
if (month < 10) {
  month = "0" + month;
}
if (day < 10) {
  day = "0" + day;
}
console.log(year + "" + month + "" + day);

上述代码将返回当前日期加上30天后的日期，如"20220316"。

九、Vue获取当前日期及一个月后的时间

Vue获取当前日期及一个月后的时间同样需要先获取当前日期时间戳，然后加上30天的时间戳，最后转化为日期格式。代码示例如下：


var today = new Date();
var nextMonth = new Date(today.getTime() + 30 * 24 * 60 * 60 * 1000);
var year1 = today.getFullYear();
var month1 = today.getMonth() + 1;
var day1 = today.getDate();
if (month1 < 10) {
  month1 = "0" + month1;
}
if (day1 < 10) {
  day1 = "0" + day1;
}
var year2 = nextMonth.getFullYear();
var month2 = nextMonth.getMonth() + 1;
var day2 = nextMonth.getDate();
if (month2 < 10) {
  month2 = "0" + month2;
}
if (day2 < 10) {
  day2 = "0" + day2;
}
console.log("当前日期：" + year1 + "-" + month1 + "-" + day1);
console.log("一个月后的日期：" + year2 + "-" + month2 + "-" + day2);

上述代码将返回当前日期及一个月后的日期，如"当前日期：2022-02-14"和"一个月后的日期：2022-03-16"。