vue 获取当前日期

// 在 Vue 组件中获取当前日期的示例代码

<template>
  <div>
    <p>当前日期是: {{ currentDate }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      currentDate: ''
    };
  },
  created() {
    // 使用 created 生命周期钩子在组件创建时获取当前日期
    this.currentDate = this.getCurrentDate();
  },
  methods: {
    getCurrentDate() {
      const today = new Date();
      const year = today.getFullYear();
      const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始，所以需要加 1，并确保两位数
      const day = String(today.getDate()).padStart(2, '0'); // 确保日期为两位数
      return `${year}-${month}-${day}`;
    }
  }
};
</script>

解释说明：

1. 模板部分：在 <template> 中使用了 {{ currentDate }} 来显示当前日期。
2. 数据属性：在 data() 函数中定义了一个 currentDate 变量，用于存储当前日期。
3. 生命周期钩子：使用 created() 钩子在组件创建时调用 getCurrentDate() 方法来获取当前日期。
4. 方法：getCurrentDate() 方法通过 new Date() 获取当前日期，并格式化为 YYYY-MM-DD 格式。