如何使用Typescript在函数组件上设置变量

import React, { useState } from 'react';

function Counter() {
  // 声明一个名为“count”的状态变量，初始值为0
  const [count, setCount] = useState<number>(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

export default Counter;

import React from 'react';

function Greeting(props: { name: string }) {
  let greetingMessage = `Hello, ${props.name}!`;

  return <div>{greetingMessage}</div>;
}

export default Greeting;

import React, { useState } from 'react';

function Timer() {
  const [seconds, setSeconds] = useState<number>(0);

  // ... 其他逻辑

  return (
    <div>
      <p>Seconds: {seconds}</p>
    </div>
  );
}

export default Timer;

// 错误的做法
setCount(count++); // 不会触发重新渲染

// 正确的做法
setCount(prevCount => prevCount + 1); // 使用函数形式更新状态