当我们选择未来日期并单击清除按钮时，如何将日期选择器重置为 vuejs 中的当前日期答案

【问题标题】：How to reset the date picker to current date in vuejs when we select future dates and click on clear button当我们选择未来日期并单击清除按钮时，如何将日期选择器重置为 vuejs 中的当前日期
【发布时间】：2021-10-29 03:47:18
【问题描述】：

当用户选择上个月或下个月的日期，然后单击日期字段中的清除图标时。日期选择器应重置为当前日期。

示例：我在 datepicker 的日期字段中选择日期为 03-09-2021。我现在希望清除日期字段，并且单击日期字段中的清除图标。日期选择器不会重置为 currentdate(31-08-21) 但仍停留在 03-09-2021 。附上图片以供参考。提前致谢

![1]:https://i.stack.imgur.com/ghbiK.png

！ [1]：https://i.stack.imgur.com/jYeEm.png

【问题讨论】：

能否请您向我们提供一个更好的错误描述，以及可能导致问题的代码的 sn-p。
@Tarkan 当用户选择上个月或下个月的日期，然后单击日期字段中的清除图标时..日期选择器应重置为当前日期..但在此处我的问题是当我点击清除按钮时，日期选择器仍然显示我之前选择的日期/月份
请查看How to Ask 并将您的所有信息放在您的问题中，而不是放在 cmets 中。

标签： javascript vue.js datepicker vuetify.js

【解决方案1】：

将 v-model 的值设置为 null 将清除日期选择器。

Check this example:

检查下面的可行解决方案

您可以使用DayJs 让事情变得简单

<template>
  <div>
    <!--    Clear Button  -->
    <v-btn @click="resetDate">Clear</v-btn>
    <!--Date Picker-->
    <v-date-picker v-model="myDate"></v-date-picker>
  </div>
</template>

<script>
export default {
  name: "DatePickerExample",
  data() {
    return {
      myDate: null
    };
  },
  methods: {
    resetDate() {
      let d = new Date();
      let ye = new Intl.DateTimeFormat("en", { year: "numeric" }).format(d);
      let mo = new Intl.DateTimeFormat("en", { month: "numeric" }).format(d);
      let da = new Intl.DateTimeFormat("en", { day: "2-digit" }).format(d);
      this.myDate = `${ye}-${mo}-${da}`;
    },
    withDayJs(){
      this.myDate = dayjs().format('YYYY-MM-DD')
    }
  }
};
</script>

选中此项以了解resetDate() 函数。

选中此项以了解withDayJs() 函数。

【讨论】：