使用React钩子计算状态值的总和

import React, { useState } from 'react';

function SumCalculator() {
  const [num1, setNum1] = useState(0);
  const [num2, setNum2] = useState(0);
  const [sum, setSum] = useState(0);

  const calculateSum = () => {
    const total = num1 + num2;
    setSum(total);
  };

  return (
    <div>
      <input type="number" value={num1} onChange={(e) => setNum1(parseInt(e.target.value))} />
      <input type="number" value={num2} onChange={(e) => setNum2(parseInt(e.target.value))} />
      <button onClick={calculateSum}>Calculate</button>
      <p>Sum: {sum}</p>
    </div>
  );
}