如何将ISO 8601日期标准化为本地时间，解决日期显示错位问题？

问题原因 #

• 核心是JavaScript的Date对象同时存储时间戳和本地时区信息，DayPickerInput组件默认读取日期的UTC属性渲染，西半球时区傍晚时分本地日期和UTC日期刚好相差1天，就会显示为次日。
• 你之前的修复代码是对时间戳做偏移，但组件渲染时还是读取UTC日期属性，所以没有效果。

修复方案 #

直接统一所有日期读写逻辑都对齐本地时区，不要修改时间戳做偏移计算，正确代码如下：

const initDate = new Date()
// 初始化时清空时间部分，只保留本地日期
initDate.setHours(0, 0, 0, 0)
const [date, setDate] = useState(initDate)

<DayPickerInput
  format="YYYY/MM/DD"
  // 强制按本地日期解析输入的字符串
  parseDate={(str) => {
    const [year, month, day] = str.split('/').map(Number)
    return new Date(year, month - 1, day, 0, 0, 0, 0)
  }}
  // 强制按本地日期格式化显示，不使用组件默认的UTC逻辑
  formatDate={(date) => {
    const y = date.getFullYear()
    const m = String(date.getMonth() + 1).padStart(2, '0')
    const d = String(date.getDate()).padStart(2, '0')
    return `${y}/${m}/${d}`
  }}
  onDayChange={(day) => {
    // 选中时直接生成对应本地日期的Date对象
    const newDate = new Date(day.getFullYear(), day.getMonth(), day.getDate(), 0, 0, 0, 0)
    setDate(newDate)
  }}
/>

生效原理 #

所有日期的读写都使用getFullYear、getMonth、getDate等本地时区的API，没有对时间戳做偏移修改，完全对齐本地时区的日期显示逻辑，不会再出现时区差导致的日期跳转问题。

内容的提问来源于stack exchange，提问作者Tyler Morales