在Material UI日期选择器中突出显示周末(星期六和星期日)

import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import { DatePicker } from '@material-ui/pickers';

const useStyles = makeStyles(theme => ({
  weekend: {
    color: 'red', // 设置周末日期的颜色
    fontWeight: 'bold', // 设置周末日期的字体加粗
  },
}));

const MyDatePicker = () => {
  const classes = useStyles();

  const renderDay = (date, selectedDate, dayInCurrentMonth, dayComponent) => {
    const isWeekend = date.getDay() === 0 || date.getDay() === 6; // 判断是否为周末日期

    let className = '';
    if (isWeekend) {
      className = classes.weekend; // 应用自定义样式
    }

    return (
      <div className={className}>
        {dayComponent}
      </div>
    );
  };

  return (
    <DatePicker
      renderDay={renderDay}
    />
  );
};