React/Typescript --至少需要'3‘参数，但JSX工厂'React.createElement’最多只能提供'2‘。TS622
React/Typescript --至少需要'3‘参数，但JSX工厂'React.createElement’最多只能提供'2‘。TS622
提问于 2021-02-15 12:07:48
我有这样的组成部分：
const TheBarTitle = (
theClass: any,
columnTitle: string,
onClickAction: any,
) => {
return (
<div
className={theClass}
title="Click to add this filter"
onClick={onClickAction}
>
{columnTitle}
</div>
);
};它是这样使用的：
render: (rowData): any => {
return (
<div className={classes.contentxyz}>
......... </div>
);
},
},
{
title: (
<TheBarTitle
theClass={classes.contentxyz}
columnTitle="THIS IS THE TITLE"
onClickAction={(e: any) =>
this.handleTooltip(
e,
'theeetitle:',
)
}
/>
),
....但是，我得到了错误：Tag 'TheBarTitle' expects at least '3' arguments, but the JSX factory 'React.createElement' provides at most '2'. TS622
我实际上使用了3个参数。你知不知道我做错了什么而它只看到了2？
回答 2
Stack Overflow用户
回答已采纳
发布于 2021-02-15 12:25:10
您将函数调用与组合创建方法混合在一起。将TheBarTitle更改为FunctionComponent创建方法
interface Props {
theClass: any
columnTitle: string
onClickAction: any
}
const TheBarTitle: React.FC<Props> = ({theClass, columnTitle, onClickAction}) => {
return (
<div
className={theClass}
title="Click to add this filter"
onClick={onClickAction}
>
{columnTitle}
</div>
)
}或者调用此函数：
title: TheBarTitle(classes.contentxyz, "THIS IS THE TITLE", (e: any) =>
this.handleTooltip(e, 'theeetitle:')
))对于后者，我建议也更改命名的大小写。
Stack Overflow用户
发布于 2021-07-19 15:11:04
对上述问题的补充答复：
const TheBarTitle = (
theClass: any,
columnTitle: string,
onClickAction: any,
) => {
return ( ... );
};对于组件:括号之间的参数是我们提供给函数的参数，而React只期望两个可能的值(对象) ==>，因此没有像上面引用的那样的值作为参数)。
object
- children?：
- 道具:成为非强制性对象
您要做的是使用：
- (反应的道具旁)提供了用点符号访问道具的方法，而
- 则提供直接访问道具的破坏性(在括号之间的==>中有花括号，用于访问道具)
。
它应该是：
interface Props {
theClass: any
columnTitle: string
onClickAction: any
}
// Regular
const TheBarTitle = ( props: Props ) => {
const { ... } = props // or props.[YOUR PROPS] to access your named props
return ( ... );
};
// Destructuring version
const TheBarTitle = ({
theClass,
columnTitle,
onClickAction,
} : Props ) => { return ( ... ); };页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/66207765
复制相关文章
相似问题
腾讯云开发者
