八、Vue3组件库经验[Ant Design]

一、Ant Design

地址：https://2x.antdv.com/components/overview-cn/

1.DatePicker 日期选择框

问题1：当将时间加载到DatePicker 日期选择时，用出现bug卡住，并报错

原因：DatePicker 需要的dayjs处理后的数据格式

处理办法：

import dayjs from 'dayjs'
publicationYear = dayjs(publicationYear)

问题2：使用DatePicker时间差了8小时

原因：DatePicker默认是0时区

处理办法：

// 错误例子
<a-date-picker
  format="YYYY-MM-DD"
  v-model:value="dialogFormState.actualReturnDate"
  placeholder="归还时间"
  style="width: 100%" />
// 正确例子
// 关键在于valueFormat="YYYY-MM-DDTHH:mm:ss" 具体数据格式根后端接收的数据格式有关
<a-date-picker
  format="YYYY-MM-DD"
  valueFormat="YYYY-MM-DDTHH:mm:ss"
  v-model:value="dialogFormState.actualReturnDate"
  placeholder="归还时间"
  style="width: 100%" />