如何将星期几更改为 SUN、TUE 等答案

【问题标题】：How to change the days of week into SUN, TUE, etc如何将星期几更改为 SUN、TUE 等
【发布时间】：2021-12-08 04:46:17
【问题描述】：

我使用了新版本 material-ui (v5) 的 CalendarPicker，但我似乎无法找到一种方法来处理默认的星期几首字母。从下面的图片我希望它改变

S、M、T、W、T、F、S

进入

周日、周一、周二、周三、周四、周五、周六

Sample image

这是我的示例代码：

import React from "react"
import isWeekend from "date-fns/isWeekend"
import MuiCalendarPicker from "@mui/lab/CalendarPicker"
import AdapterDateFns from "@mui/lab/AdapterDateFns"
import LocalizationProvider from "@mui/lab/LocalizationProvider"
import { ComponentWrapper } from "./CalendarPicker.style"

interface Props {}

const CalendarPicker: React.FC<Props> = () => {
  const [value, setValue] = React.useState<Date | null>(new Date())

  return (
    <LocalizationProvider dateAdapter={AdapterDateFns}>
      <ComponentWrapper>
        <MuiCalendarPicker<Date>
          openTo="day"
          date={value}
          shouldDisableDate={isWeekend}
          onChange={(newValue) => {
            setValue(newValue)
          }}
        />
      </ComponentWrapper>
    </LocalizationProvider>
  )
}

export default CalendarPicker

【问题讨论】：

标签： reactjs material-ui date-fns

【解决方案1】：

你为什么不创建一个函数，里面有一个开关，它接收日期，获取星期几，然后输出你想要的任何字符串例如：


const formatDay = (date) => {
  switch(date.getDay()){
    case 0: 
      return "SUN"
    case 1:
     return "MON"
    case 2:
     return "TUES"
    .......
}
}

然后，您检查 node_modules 文件夹中的 mui lib，并使用此函数包装它们返回的内容，然后您就可以开始了

【讨论】：

让我看看这个。感谢您的回复！