[React] Props를 활용해 버튼 재사용, function 사용 및 types 지정하기

같은 버튼을 사용 시, 스타일은 같고 버튼 텍스트만 다르게 하고 싶으면 이때 props의 개념을 사용하면 된다. Boolean 형식도 넘겨진다. function Btn({ text, big }) { /*원래 props에서 하나의 인자만 받는다. Btn(props) 이렇게. 다만 Object형식으로 받기에 {text}형식으로 꺼내준다. 그러면 {text, big} 등 여러 인자를 받을 수 있다. */ return ( <button style={{ backgroundColor: "tomato", color: "white", padding: "10px 20px", //style안에서 다중값을 사용하려면 이렇게 border: 0, borderRadius: 10, fontSize: big ? 20 : 16, }} > {text} </button> ); } function App() { return ( <div> <Btn text="Save Changes" big={true} /> <Btn t...

원문링크 : [React] Props를 활용해 버튼 재사용, function 사용 및 types 지정하기