[2차 프로젝트]스타일컴포넌트 (Props)

백수·2022년 8월 7일
0

스타일 컴포넌트부분에서 삼항연산자 구현방법

기존에 틀린예

Inner
        style={{
          maxWidth: isCheckPath ? 'none' : '1120px',
          padding: isCheckPath ? '0 80px' : '0',
        }

//이렇게 리엑트 리턴 부분에서 삼항연산자를 처리하옇는데 
  <Inner path={isCheckPath} />//이렇게 리턴부분에서 처리하고 
    
    
const Inner = styled.div`
  width: 100%;
  max-width: ${props => (props.path ? 'none' : '1120px')};
  padding: ${props => (props.path  ? '0 80px' : '0')};
  margin: 0 auto;
`;
//스타일 컴퍼넌트 부분에서 이렇게 처리할수 있다.
profile
안녕하세요백수아빠입니다.

0개의 댓글