[React / Styled Component] 스타일 컴포넌트 props 사용하는 법 (typescript)

interface MemberInfoTextProps {
  isBold: boolean;
  fontSize: string;
  fontColor: string;
  textAlign: string;
}

export const InfoText = styled.p<MemberInfoTextProps>`
  font-weight: ${props => props.isBold ? "bold" : "normal"};
  font-size: ${props => props.fontSize};
  color: ${props => props.fontColor};
  text-align: ${props => props.textAlign};
`

위와 같이 interface로 props의 속성들을 정의해주고 <>괄호 안에 이 interface를 넣습니다.

그리고 ${}로 props를 받은 뒤 이용해주면 됩니다.