Type을 사용사례

type을 활용해서 이미 사용하고 있던 UI라이브러리의 컴포넌트의 props를 그대로 전달받지만 추가로 props를 지정해서 사용해보았다.

import { TextFieldProps } from '@mui/material/TextField'

type Props = {
  name: string
  rules?: Object
  control?: Control<any>
} & TextFieldProps

const { name, rules, control: propsControl, ...rest } = props

 <TextField
        value={value}
        onChange={onChange}
        size="small"
        {...rest}
        error={!!error?.message}
        helperText={error?.message ? error?.message : ''}
      />

기존의 textField에서 받고있는 props에 커스텀해서 받고싶은 props들을 추가로 지정해서 새로운 props type을 만들어서 사용했보았다.
스프레드 연산자로 TextField에 값을 그대로 넣어줘서 바로 커스텀이 가능하게 사용할 수 있게 작업하였다.