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″。