syedsibtain
Fri Jan 13 2023
We have 7 different TypeScript utility types, like
React's utility type
It is used in the definition of the component to identify the types of properties it can receive, including the children prop, which contains any elements contained within the component's JSX. In addition to children, it allows for the use of various props.
UseCase Example
Additional Resources: https://www.chakshunyu.com/blog/7-typescript-utility-types-for-react-developers/
Pick
Omit
Partial
NonNullable
React.ComponentProps
React.MouseEventHandler
and special one React.PropsWithChildren
React's utility type
PropsWithChildren
enables components to take both props and child elements as input.It is used in the definition of the component to identify the types of properties it can receive, including the children prop, which contains any elements contained within the component's JSX. In addition to children, it allows for the use of various props.
UseCase Example
const Track = ({ children }:PropsWithChildren) => {
return (
{children}
);
};
Additional Resources: https://www.chakshunyu.com/blog/7-typescript-utility-types-for-react-developers/