Reactjs 使用数组分解结构时保留钩子类型

我正在使用一个简单的钩子来导出动画助手和元素引用

import { gsap } from 'gsap';
import { useRef } from 'react';

export function useTween<R extends gsap.TweenTarget>(vars: gsap.TweenVars['pixi']) {
  const tweenRef = useRef<R>(null);
  const tween = gsap.to(tweenRef.current, { pixi: vars });

  return [tween, tweenRef];
}

从“gsap”导入{gsap}；
从“react”导入{useRef}；
导出函数useTween（变量：gsap.TweenVars['pixi']））{
const tweenRef=useRef（null）；
常数tween=gsap.to（tweeref.current，{pixi:vars}）；
返回[tween，tweenRef]；
}

这里重要的是返回的数组有类型，但是当我在另一个组件中使用它时，即

const [textTween, textRef] = useTween<Text>({ scale: 2 });

const[textTween，textRef]=useTween（{scale:2}）；

---

现在

textween

和

textRef

都有

any

的类型，我的印象是这些类型会被保留，但我在这里遗漏了什么吗？

您忘记了指定函数的返回类型：

export function useTween<R extends gsap.TweenTarget>(vars: gsap.TweenVars['pixi']): [gsap.TweenTarget, gsap.TweenTarget] {

导出函数useTween（变量：gsap.TweenVars['pixi']）：[gsap.TweenTarget，gsap.TweenTarget]{

---

您可以尝试将返回类型添加到钩子中，或者创建一个函数类型，然后使用它，这可能是更好的解决方法