조건부렌더링 true 생략하기

🔖 조건부렌더링 true 생략하기

📌 배운 내용 및 기억하고 싶은 내용

• 컴포넌트의 props 값을 설정하게 될 때 props 이름만 작성하고 값 설정을 생략한다면 true 로 설정한 것으로 간주함

// Hi.js
import React from 'react';

function Hi({ color, name, isEnglish }) {
  return <div style=>{isSpecial && <span>Hello!</span>} 안녕하세요 {name}</div>
}

Hello.defaultProps = {
  name: '이름없음'
}

export default Hi;

// App.js
import React from 'react';
import Hi from './Hi';

function App() {
  return (
    <>
    	// isSpecial={true} 와 동일한 의미
      <Hi name="Yoo" color="blue" isEnglish/>
      <Hi color="pink"/>
    </>
  );
}

export default App;