• • bounty将在4天后过期**。回答此问题可获得+50声望奖励。staticdev希望引起更多人对此问题的关注：一个优雅的/文档化的解决方案对于解决moment.js的弃用所面临的基本问题是必要的，因为当前的答案在客户端上不能很好地工作。而且，Vue/Typescript的这种组合没有那么广泛的受众。

我尝试在Vue 3中使用TypeScript将日期格式设置为dd/mm/yyyy格式，但无法应用该格式。我看到许多答案建议使用moment.js，但该库的文档说它已经过时，可以是achieved with native toLocaleDateString("en-GB")。
我的默认值应该是一个月中最后一个工作日。下面是我的代码，它可以工作，但格式错误：

<template>
  <div>
    <label for="date">Date:</label>
    <input type="date" id="date" v-model="selectedDate" />
    <button @click="submitDate">Submit</button>
  </div>
</template>

<script setup lang="ts">
import { ref, computed } from "vue";

const lastWorkingDayOfMonth = computed(() => {
  const today = new Date();

  let date = new Date(today.getFullYear(), today.getMonth() + 1, 0);
  while (date.getDay() === 0 || date.getDay() === 6) {
    date.setDate(date.getDate() - 1);
  }

  if (date <= today) {
    return date.toISOString().substr(0, 10);
  }

  const lastDayOfPreviousMonth = new Date(
    today.getFullYear(),
    today.getMonth(),
    0
  );
  let lastWorkingDayOfPreviousMonth = new Date(lastDayOfPreviousMonth);
  while (
    lastWorkingDayOfPreviousMonth.getDay() === 0 ||
    lastWorkingDayOfPreviousMonth.getDay() === 6
  ) {
    lastWorkingDayOfPreviousMonth.setDate(
      lastWorkingDayOfPreviousMonth.getDate() - 1
    );
  }

  return lastWorkingDayOfPreviousMonth.toISOString().substr(0, 10);
});

const selectedDate = ref(lastWorkingDayOfMonth.value);

function submitDate() {
  // Handle the submission of the selected date
  console.log(selectedDate);
}
</script>

我尝试使用：

import { ref, computed, watch } from "vue";
// ...
watch(selectedDate, (newValue, oldValue) => {
  const newDate = new Date(newValue);
  const formattedDate = newDate.toLocaleDateString("en-GB");
  selectedDate.value = formattedDate;
});

还尝试添加：

const format = (value: string) => {
  const formatter = new Intl.DateTimeFormat("en-GB", {
    year: "numeric",
    month: "2-digit",
    day: "2-digit"
  });
  return formatter.format(new Date(value));
};
// ...
    <input type="date" id="date" :formatter="format" v-model="selectedDate" />

在这两种情况下，当我进入页面时，日期仍然显示为默认格式（mm/dd/yyyy）。
我也试过使用这个other question的解决方案，但是<input type="date">不能正确地使用字符串值。我真的很想有一个选择日期的小部件。
如何正确地将日期格式化为dd/mm/yyyy格式，并在不安装其他库的情况下处理这些小部件问题？
任何帮助都将不胜感激。