[MUI] 그리드 타입 지정

DataGrid 컴포넌트는 입력할때 타입을 안지정해주면 string으로 값이 바껴버린다.

 

기본적으로 CellEditCommit 이벤트의 params에 들어있는 value 값이 문자열로 넘어온다.

또 공백이 들어가면 변수의 타입이 string으로 변환됨

타입 검사하는건 매우 귀찮기 때문에 컬럼 타입은 필수적으로 지정해줘야 함.

// MUI에서 지원하는 타입 목록
// 'string' : 문자
// 'number' : 숫자
// 'date' : 날짜
// 'dateTime' : 날짜 + 시간
// 'boolean' : 불리언
// 'singleSelect' : 단일 선택 콤보박스
// 'actions' : 동작. 아마 클릭하면 어떤 동작(함수)을 실행하는 컬럼인거같다.
export declare type GridNativeColTypes = 'string' | 'number' | 'date' | 'dateTime' | 'boolean' | 'singleSelect' | 'actions';

const columns: GridColDef[] = [
  { field: "A", headerName: "Column A", width: 150, editable: true, type: "number" },
  { field: "B", headerName: "Column B", width: 150, editable: true, type: "number" },
  { field: "C", headerName: "Column C", width: 150, editable: true, type: "number" },
];