Typescript 键入基于可选输入返回两种不同类型的函数

我有这个功能：

function useSomething<T extends Element>(ref?: React.RefObject<T>) {
  const elementRef = ref ? ref : useRef(null)
  const [bb, setBb] = useState(false)

  // do something...

  return ref ? [bb] : [elementRef, bb]
}

函数useSomething（参考？：React.reObject）{
常量elementRef=ref？ref:useRef（null）
const[bb，setBb]=useState（false）
//做点什么。。。
返回参考？[bb]：[elementRef，bb]
}

因此，它可以通过两种方式调用：

const [ref, bb] = useSomething<HTMLDivElement>()

const[ref，bb]=useSomething（）

或

const ref=useRef（空）
常数[bb]=使用某物（参考）
//类型错误

我得到：

Type 'boolean | MutableRefObject<any>' is not assignable to type 'LegacyRef<HTMLDivElement>'.
Type 'false' is not assignable to type 'LegacyRef<HTMLDivElement>'

类型“boolean | MutableRefObject”不可分配给类型“LegacyRef”。
类型“false”不可分配给类型“LegacyRef”

---

如何键入函数以使返回类型始终正确？

Typescript不会根据条件推断返回类型。您需要使用重载来获得所需的效果：

function useSomething<T extends Element>(ref: React.RefObject<T>): [boolean]
function useSomething<T extends Element>(): [React.RefObject<T>, boolean]
function useSomething<T extends Element>(ref?: React.RefObject<T>) {
  const elementRef = ref ? ref : useRef(null)
  const [bb, setBb] = useState(false)

  // do something...

  return ref ? [bb] : [elementRef, bb]
}

函数useSomething（ref:React.reObject）：[boolean]
函数useSomething（）：[React.reObject，布尔值]
函数useSomething（参考？：React.reObject）{
常量elementRef=ref？ref:useRef（null）
const[bb，setBb]=useState（false）
//做点什么。。。
返回参考？[bb]：[elementRef，bb]
}

function useSomething<T extends Element>(ref: React.RefObject<T>): [boolean]
function useSomething<T extends Element>(): [React.RefObject<T>, boolean]
function useSomething<T extends Element>(ref?: React.RefObject<T>) {
  const elementRef = ref ? ref : useRef(null)
  const [bb, setBb] = useState(false)

  // do something...

  return ref ? [bb] : [elementRef, bb]
}