nodejs 014: React.FC 与 Evergreen(常青树) React UI 框架的的Dialog组件

FakeOccupational

于 2024-09-22 15:00:00 发布

阅读量569

点赞数 9

CC 4.0 BY-SA版权

分类专栏：服务化&架构文章标签： react.js ui 前端

本文链接：https://blog.csdn.net/ResumeProject/article/details/142393484

React.FC

React.FC是React中用于定义函数组件“Function Component”的类型。它代表，可以帮助你在TypeScript中提供类型检查和自动补全。使用React.FC时，可以明确指定组件的props类型，并且它会自动推导children属性。下面是一个使用 React.FC 定义函数组件的示例：

import React from 'react';

interface MyComponentProps {
  title: string;
  count: number;
}

// 用React.FC声明一个函数组件
const MyComponent: React.FC<MyComponentProps> = ({ title, count, children }) => {
  return (
    <div>
      <h1>{title}</h1>
      <p>Count: {count}</p>
      {children}
    </div>
  );
};

// 使用示例
const App: React.FC = () => {
  return (
    <MyComponent title="Hello World" count={5}>
      <p>This is a child element!</p>
    </MyComponent>
  );
};

export default App;