Issue
I would like a custom button to optionally receive type attribute:
export interface ButtonProps {
children: React.ReactNode;
onClick?: (e: React.MouseEvent<HTMLElement>) => void;
type: ??
}
export const Button: React.FunctionComponent<ButtonProps> = ({ children, ...buttonProps }) => {
return <StyledButton {...buttonProps}>{children}</StyledButton>;
};
export default Button;
Same as with 'onClick' which is working. Any type I'm trying to fill in, it still throws an error. What is the correct type for the type attribute?
Solution
You can write a button
in your editor:
<button type='' />
and probably ctrl/command + click on the type
, or hover on the type
attribute see its type.
interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
autoFocus?: boolean | undefined;
disabled?: boolean | undefined;
form?: string | undefined;
formAction?: string | undefined;
formEncType?: string | undefined;
formMethod?: string | undefined;
formNoValidate?: boolean | undefined;
formTarget?: string | undefined;
name?: string | undefined;
type?: 'submit' | 'reset' | 'button' | undefined;
value?: string | ReadonlyArray<string> | number | undefined;
}
Also you can extend the props of your component:
export interface ButtonProps extends React.HTMLProps<HTMLButtonElement> {}
You may want to overwrite or omit the types you want.
Answered By - c0m1t
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.