[ Web ]/React.js
[React.js] Kossie Coder - 7강. 컴포넌트로 반복 제거
HoYoung Kim
2021. 12. 28. 15:31
1. Component 생성
Component를 사용하면 반복적인 코드를 재사용할 수 있다.
import React, {useState} from "react";
const Counter = () => {
const [count, setCount] = useState(0);
const increment = () => {
setCount(count + 1);
};
return (
<button onClick={increment}>Click {count}</button>
);
};
export default Counter;
2. Component 사용
import React from "react";
import Counter from "./components/Counter";
function App() {
return (
<div className="App">
{/* 이런식으로 같은 컴포넌트를 여러 번 사용하여 코드를 재사용할 수 있다. */}
<Counter/>
<Counter/>
<Counter/>
</div>
);
}
강의 링크