import { useState } from 'react';
import './App.css';
function App() {
	const [num, setNum] = useState(0);
	const [total, setTotal] = useState(0);
	const calc = () => {
		let result = 0;
		for (let i = 0; i <= num; i++) {
			result += i;
		}
		setTotal(result);
	};
	return (
		<div className='App'>
			<h1>React sample</h1>
			<header className="container">
				<div className="card">
					<h3>※合計を計算する</h3>
					<h4>合計：{total}</h4>
					<input type="number" value={num}
						onChange={(e) => setNum(e.target.value)} />
					<button onClick={calc}>Count</button>
				</div>
			</header>
		</div>
	);
}
export default App;