我尝试用“NextJs”、“date-fns”和“React-Calendar”做一个新项目，但我在服务器端（nodejs =英语格式）和客户端（法语）之间遇到了渲染日期问题：警告：文本内容不匹配。服务器：《2023年4月》客户端：“avril 2023”.我尝试应用.toLocaleDateString（）来格式化服务器端的日期，但它不起作用：（

import { FC, useEffect, useState } from "react";
import ReactCalendar from "react-calendar";
import {add, format} from 'date-fns'

interface indexProps {}

interface DateType {
  justDate: Date | null;
  dateTime: Date | null;
}

const index: FC<indexProps> = ({}) => {
  const [date, setDate] = useState<DateType>({
    justDate: null,
    dateTime: null,
  });

  const getTimes = () => {
    if(!date.justDate) return

    const { justDate } = date
    const beginning = add(justDate, {hours: 13})
    const end = add(justDate, {hours: 17})
    const interval = 60 // in minutes
    
    const times = []
    for (let i = beginning; i <= end; i = add(i, {minutes: interval})) {
        times.push(i)
    }
    return times
}

const times = getTimes()

// useEffect(() => setDate(date.toLocaleDateString("fr")), [])

  return (
    <div className="flex h-screen flex-col items-center justify-center">
      {date.justDate ? (
        <div className="flex gap-4">
            {times?.map((time, i) => (
                <div key={`time-${i}`} className='rounded-sm bg-gray-100 p-2'>
                   <button type="button" onClick={() => setDate((prev) => ({...prev, dateTime: time}))}>
                    {format(time, 'kk:mm')}</button> 
                </div>
            ))}
        </div>
      ) : (
        <ReactCalendar
          minDate={new Date()}
          className="REACT-CALENDAR p-2"
          view="month"
          onClickDay={(date) =>
            setDate((prev) => ({ ...prev, justDate: date }))
          }
        />
      )}
    </div>
  );
};

export default index;

提前感谢您的帮助！