vue3+antd中使用Dayjs实现输出的日期格式化，和限制自定义日期选择器的可选范围

场景复现

在vue3+antd项目中用到了日期选择器，但是默认的日期选择的结果是标准的日期格式，我们往往需要对最后的结果进行一定的格式化输出

一般输出的是这种标准的数据格式

如果我们想对时间进行指定的格式化输出，通常大家会想到moment，但是这里我们使用的是antd框架，在 V3 版本开始，默认使用 dayjs 替换了 momentjs 库，所以我们这里可以使用同样功能强大的dayjs库，不需要额外的下载安装

Day.js的使用

关于dayjs的使用，功能同样非常强大，更多功能可以移步 官方文档
我们现在想要将上面的时间数据格式化输出为 2020-11-1的格式，则可以用如下使用方法：
先进行引入：

import dayjs, {
    
     Dayjs } from "dayjs";

然后进行使用：
dayjs().format(“YYYY-MM-DD”)进行格式化，因为我这里是响应式数据proxy，所以用JSON.parse(JSON.stringify())转了一下。

const abs = dayjs(
    JSON.parse(JSON.stringify(formState.value.count_down_end_date))
  ).format("YYYY-MM-DD");

然后我们打印数据查看格式：
可以看到日期已经是我们想要的格式

当然其他的格式都能通过下面的格式化占位符来实现

自定义日期选择器的可选范围

可以看到文档中介绍，通过disabledTime属性设置不可选的范围，

然后定义disableDate的内容：
代表禁选今天以及今天之前的内容

const disabledDate = (current: Dayjs) => {
    
    
  return (current && current < dayjs().endOf("day")); 
}

这里的具体内容可以根据自己的需求来自己定义：
比如我这里需求：只能选择明天到未来999天以内的日期：
还是需要用到dayjs中的方法来实现

const disabledDate = (current: Dayjs) => {
    
    
  return (current && current < dayjs().endOf("day")) || (current > dayjs().add(999,'day')); 
}

这样就能限制选择的日期范围：