当前位置:网站首页>传递泛型给JSX元素
传递泛型给JSX元素
2022-08-02 07:31:00 【Pandy : )】
将泛型传给 JSX 元素语法:
<Component<GenericType> />
挺简单的,刚好最近写的一个组件使用到了泛型,主要是给 Props 使用,可以看看这个例子:
- 先定义 Props 接口:
interface Props<LabelType extends string = string> extends CommonProps {
tabItems: Array<{
label: LabelType;
}>;
selectedTab: LabelType;
setSelectedTab: Dispatch<SetStateAction<LabelType>>;
}
- 再定义组件函数:
export default function SlideTabs<LabelType extends string = string>({
tabItems,
selectedTab,
setSelectedTab,
}: Props<LabelType>): React.ReactElement {
//...
}
- 接着在引用组件上传递泛型:
<SlideTabs<ResourceType>
{...{ tabItems, selectedTab, setSelectedTab }}
/>
REFERENCE
边栏推荐
猜你喜欢
MySQL-Execution Process + Cache + Storage Engine
Mysql error 2003 solution Can 't connect to Mysql server on' localhost '(10061).
(2022 Niu Ke Duo School 5) D-Birds in the tree (tree DP)
多版本node的安装与切换详细操作
(2022 Niu Ke Duo School 5) B-Watches (two points)
MySQL常见索引类型
研发创新编码器霍尔板,引领企业高质量发展
Azure Synapse Analytics上创建用户并赋予权限
Probability Theory and Mathematical Statistics
Metasploit(MSF)基础超级详细版
随机推荐
(2022 Nioke Duo School 5) C-Bit Transmission (Thinking)
HCIP 第十一天
Splunk Field Caculated Calculated Field
Hack The Box - File Transfers Module详细讲解中文教程
Aided by training and learning by battle | The new version of the Offensive and Defense World Platform is officially launched!
(2022 Niu Ke Duo School 5) D-Birds in the tree (tree DP)
sql创建表格 如图 运行完提示invalid table name 是什么原因
ROS文件系统以及相关命令
MySQL报错1055解决办法:[Err] 1055 - Expression #1 of ORDER BY clause is not in GROUP BY clause and contains
2022-08-01 第四小组 修身课 学习笔记(every day)
metabase访问adb mysql 如何控制会话时区??
7.联合索引(最左前缀原则)
机器学习笔记--数学库
HCIP第七天
有点奇怪!访问目的网址,主机能容器却不行
HCIP 第四天
59: Chapter 5: Develop admin management services: 12: MongoDB usage scenarios; (non-core data, non-core data with a relatively large amount of data, small private files such as face photos;)
Install Metasploitable2 on VMware
Comprehensive experiment of MPLS and BGP
OC-NSString