有没有一种用React钩子和Typescript来定义状态的“正确”方式？

const [isActive, setIsActive] = useState<boolean>(false);

import { useState } from 'react';

const useCounter = (initialCount: number) => {
  const [count, setCount] = useState<number>(initialCount);

  const increment = () => {
    setCount(count + 1);
  };

  const decrement = () => {
    setCount(count - 1);
  };

  return { count, increment, decrement };
};

// 在组件中使用自定义钩子
const CounterComponent: React.FC = () => {
  const { count, increment, decrement } = useCounter(0);

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={increment}>Increment</button>
      <button onClick={decrement}>Decrement</button>
    </div>
  );
};