reactjs - 导出匿名函数组件 React Typescript

标签 reactjs typescript react-typescript

我最近才开始使用 Typescript,但还没有找到实现此目标的简单方法

import React from 'react'
...
export default () => <div>My awesome anonymous functional component</div>;

我通常在 index.jsx/index.tsx 文件中使用它,因此语法可以帮助我的组件保持干净。

最佳答案

您应该仍然能够毫无问题地执行此操作,但我更喜欢的语法如下:

export const MyComponent: React.FC = () => <div>My component</div>

出于这里提到的一些原因,我倾向于避免在 typescript 中使用默认导出:https://basarat.gitbook.io/typescript/main-1/defaultisbad

此外,通过上述内容,我将获得功能组件(例如 children 等)所需的类型。

关于reactjs - 导出匿名函数组件 React Typescript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62289350/

相关文章:

javascript - 如何处理 Flux/React 中的数据变化?

javascript - 在 Touchable 高亮部分添加组件

javascript - 开 Jest : Simulate that a string property doesn't exist

reactjs - 如何在 React 自定义元素中为 MUI Material v5 创建插入点以在 shadow dom 中挂载样式

javascript - Visual Studio 2017 中的 React 项目

javascript - 如何做出正确 react 的请求?

typescript - 在 TypeScript 中推断函数参数

node.js - TypeScript,否则找不到内部声明的名称

reactjs - React HOC 作为类组件有 Typescript 错误,但作为函数组件没有

javascript - React 中 TypeScript 中事件的类型