증가 버튼을 클릭하면 OOOO 영역에 "현재 카운드는 OOO입니다."를 출력하도록, App, Todo, Title 컴포넌트를 작성해 보세요.
<p>OOOO</p> 증가--------------------------------------코드짜보기
import React, { useState } from 'react';
import Todo from './Todo';
const App = () => {
return (
<div>
<Todo />
</div>
);
};
export default App;
import React, { useState } from 'react';
import Title from './Title';
const Todo = () => {
const [count, setCount] = useState(0);
const handleIncrease = () => {
setCount(count + 1);
};
return (
<div>
<Title title="현재 카운트">
<p>현재 카운트는 {count}입니다.</p>
</Title>
<button onClick={handleIncrease}>증가</button>
</div>
);
};
export default Todo;
import React from 'react';
const Title = ({ title, children }) => {
return (
<div>
<h1>{title}</h1>
{children}
</div>
);
};
export default Title;