如何解决使用 Typescript 时,光滑的轮播被识别为一个类
我最近将一个项目更改为打字稿。在这个项目中,我使用 slick 作为我的轮播组件。我使用它的组件使用了一个非常简单的逻辑:如果窗口是可移动的(宽度状态挂钩),则渲染轮播。如果没有,则渲染另一个组件。代码如下:
import Slider from "react-slick";
...
const ParentElement = (width > 992) ? ItemsWrapper : Slider;
return (
<ParentElement {...settings}>
//some code
</ParentElement>
);
在项目中执行打字稿后,现在我在 ParentElement
上收到此错误:
如果我理解正确,它会将 Slick 识别为一个类,而不是一个组件。有谁知道为什么会这样?为什么 vanilla React 将 Slick 识别为组件,而现在将 typescript 识别为类?我四处寻找这种行为,但在网上一无所获。
解决方法
请记住,JSX 是 React 组件函数调用的语法糖,因此按照您的方式分配 ParentElement 是行不通的。您需要使其成为返回 JSX 的函数,或者更好的是将条件向下移动到组件的返回值中:
/* ...the rest of your component... */
return width > 992 ? (
<ItemsWrapper {...settings}>{/* some code */}</ItemsWrapper>
) : (
<Slider {...settings} />
);
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。