라이브러리/MUI

[MUI] 캘린더 달력 한국 시간으로 변경하기

순코딩 2025. 4. 17. 14:58
import dayjs from "dayjs";
import React from "react";
import { DemoContainer, DemoItem } from "@mui/x-date-pickers/internals/demo";
import { DateCalendar } from "@mui/x-date-pickers/DateCalendar";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider/LocalizationProvider";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import "dayjs/locale/ko";

const CalenderEditBlock = () => {
  return (
    <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="ko">
      <DemoContainer components={["DateCalendar"]}>
        <DemoItem label="readOnly" sx={{ "& .Mui-selected": { color: "blue" } }}>
          <DateCalendar defaultValue={dayjs("2022-04-17")} readOnly />
        </DemoItem>
      </DemoContainer>
    </LocalizationProvider>
  );
};

export default CalenderEditBlock;