Getting typescript errors with any

Question

I'm using typescript. An error occurs at the "as any" point.
I want to get rid of "any" and add a type, but if I change "any" to a string type, it will not work. But it didn't work.

tsError

Unexpected any. Specify a different type.eslint@typescript-eslint/no-explicit-any

import React from 'react';
import FacebookIcon ...
import LinkedinIcon ...
import TwitterIcon ...

type Props = {
  icon: 'facebook' | 'linkedin' | 'twitter';
  fontSize?: string;
};

const iconMap = {
  facebook: FacebookIcon,
  linkedin: LinkedinIcon,
  twitter: TwitterIcon
}

export const Icon = ({ icon, fontSize }: Props) => {
  const CompName = iconMap[icon];

  return (<CompName {...({ fontSize } as any)} />) as JSX.Element;};

The above isn’t a type error, but an ESLint error. Why not just pass the prop to the component as a style property: <CompName style={{ fontSize }} /> — Matt Carlotta
– Matt Carlotta, Commented Apr 12, 2021 at 5:40

user6749601 · Accepted Answer · 2021-04-12 05:47:03Z

1

Well, it is a matter of fact that you are not allowed to set any as type when casting.

return (<CompName {...({ fontSize } as any)} />) as JSX.Element;};

I'd rather guess that {fontSize} is of type number and not string.

So try it either this way:

return (<CompName {...({ fontSize } as number)} />) as JSX.Element;};

Or omit the casting entirely:

return (<CompName {...{ fontSize }} />) as JSX.Element;};

answered Apr 12, 2021 at 5:47

user6749601

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Getting typescript errors with any

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related