为什么当切换到TypeScript时，Gsap-TimelineLite会导致Object不可扩展？

Question

我有一个React App，有一个功能组件，我在那里使用了一个小的GSAP动画。

今天，我试图将应用程序从vanilla JS迁移到TypeScript，我开始使用那个小组件。

interface Props {}

const Item1Content: React.FC<Props> = ({}) => {
  let centerLabel = useRef(null);

  const timeLine = useRef<TimelineLite | null>(null);

  useEffect(() => {
    timeLine.current = new TimelineLite({ paused: true });
    timeLine.current.to(centerLabel, 0.5, { opacity: 0.1 });
  }, []);

  return (
    <>
      <CarouselItemWrapper
        backgroundImage={background}
        backgroundImageVerticalPosition={"bottom"}
      >
        <CenterLabel ref={centerLabel}>blupp blupp</CenterLabel>
      </CarouselItemWrapper>
    </>
  );
};

export default Item1Content;

代码作为.js文件工作得很好（实际上有第二个useEffect来播放动画。我把它删除了以备查错），但当我把它转为.tsx时，我在浏览器中得到以下错误。

TypeError: can't define property "_gsap": Object is not extensible

原因是这一行。

timeLine.current.to(centerLabel, 0.5, { opacity: 0.1 })

那么我说的对吗？timeLine.current后面引用的TimeLineLite-Object是不允许得到添加新属性的，问题行想做的就是这个？"错误一直都存在，但javascript就是不管不顾，反正添加了属性，但typescript就是这么严格，它告诉我 "不行，要做对！"？但我怎么才能做对呢？

谢谢你了

Answer 1

好吧，我自己弄的......我就是那么瞎。我花了好几个小时才认识到我必须使用 "centerLabel.current "而不是 "centerLabel"。