响应Onclick -没有重载匹配此调用
新来的TS和不得不说的错误不是很友好。
我试图将一个钩子函数作为一个支柱传递给一个组件，这是我添加到我的接口中的，我得到了一个我无法理解的错误。
没有重载与此调用匹配。重载2中的1，‘(道具: Pick，HTMLButtonElement>，"form“. 264 more . "onTransitionEndCapture"> &{.}& IButtonProps，"form”. 267 . "setActivity"> & Partial<...>，"form“. 267 . "setActivity"> &{.}&{.；} })：ReactElement<.>，给出了以下错误。属性'setActivity‘在类型'{子类: string :string&{}> (string & ReactElement ReactElement Component)>) >\}\}& IButtonProps，“表单”\. 267 .多. "setActivity">和Partial<...>，“表单”\. 26
我已经尝试过一些我读过的东西，比如将该方法放入一个匿名函数中，并将我的interfact设置为(e: React.MouseEvent) => void，但似乎都没有效果。从我的代码中，我觉得我做的一切都是正确的，但显然不是。
这是我的组成部分：
interface IButtonProps {
children: string,
active: Boolean,
setActivity: Function,
onClick: (e: React.MouseEvent) => void,
}
// Styling
const Button = styled.button<IButtonProps>`
${({ theme }) => `
border: ${theme.TabsBorder};
font-size: ${theme.TabsFontsize};
background-color: transparent;
flex: 1;
padding: 1rem;
outline: 0;
&:hover {
background-color: ${theme.TabActiveBackground};
color: ${theme.TabActiveColour};
}
${({ active }) => active && `
background-color: ${theme.TabActiveBackground}
color: ${theme.TabActiveColour};
`}
`}
`;
const Item: FC<IButtonProps> = ({
children,
active,
setActivity,
}) => (
<Button
active={active}
onClick={() => setActivity}
>
{children}
</Button>
);SetActivity是我要传递给组件引用的钩子。
回答 1
Stack Overflow用户
发布于 2020-03-07 05:10:40
onClick方法正在返回一个不应该是setActivity: Function的函数。它应该是它的执行
onClick={() => setActivity()}或者，如果setActivity函数已经自绑定，则可以立即将其传递给onClick支柱。
onClick={setActivity}此外，IButtonProps还将setActivity作为属性。这意味着必须将其传递给Button组件。
const Item = (props: any) => {
const { children, active, setActivity, } = props;
return (
<Button
active={active}
setActivity={() => {}}
onClick={() => setActivity()}
>
{children}
</Button>
);
};https://stackoverflow.com/questions/60577619
复制相似问题
领取专属 10元无门槛券
AI混元助手 在线答疑
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
