[React] MUI DataGrid Date Format 변경하기

[MUI or MATERIAL UI] / 날짜 표시

 

 - 2023-01-03T10:24:30.129Z

 

변경하려면 valueFormater에서 옵션을 변경하면 원하는 서식으로 변경됩니다.

import dayjs from 'dayjs';

const columns = [
   ...
   { 
     field: 'createdAt', 
     headerName: 'Join Date', 
     width: 100,
     valueFormatter: (params) => dayjs(params.value).format('DD/MM/YYYY'),
   },
   ...
]

 

[MUI or MATERIAL UI] / 원 단위 콤마 단위 표시

 - 100,000

import dayjs from 'dayjs';

const columns = [
   ...
   { 
     field: 'COST', 
     headerName: 'COST', 
     width: 100,
     valueFormatter: (params) => params.value?.toLocaleString("ko-KR"),
   },
   ...
]