ts报错Type 'number' has no call signatures.如何解决？

Question

第一次用ts, 求指导
react创建自定义组件 使用导出方法时
ts报错
Not all constituents of type 'number | Dispatch<SetStateAction<number>>' are callable.
Type 'number' has no call signatures.

useCount:

    import * as React from 'react'

/**
 *
 * @param defaultCount
 * 自定义hooks
 */
const useCount = (defaultCount: number) => {
  const [count, setCount] = React.useState(defaultCount)
  const it: any = React.useRef()

  React.useEffect(() => {
    it.current = setInterval(() => {
      console.log('add...', count)
      setCount(() => count + 1)
    }, 1000)
  }, [])

  React.useEffect(() => {
    if (count >= 10) {
      clearInterval(it.current)
    }
  });
  return [count, setCount]
}

export default useCount

index.tsx

    import * as React from 'react'
import useCount from './useCount';

export default function index() {
  const [count, setCount] = useCount(3)
   // ts报错
  // This expression is not callable.
  // Not all constituents of type 'number | Dispatch<SetStateAction<number>>' are callable.
  //   Type 'number' has no call signatures.
  const add = () => setCount(0)
 
  return (
    <div>
      usecount: { count }
      <button onClick={add}>add</button>
    </div>
  )
}

Answer 1

return [count, setCount] 返回的是 (number|Function)[] 不是你想要那個tuple類型.

你可以return ... as const (需要近期的ts版本) 或者手寫那個tuple.