Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

Type '{ |cssProperties|}' is not assignable to type 'Properties<string | number, string & {}>' in React

Ask Question return ( <a style={linkStyle} href={`${link.url}?utm_source=starter&utm_medium=start-page&utm_campaign=minimal-starter`}>link </a>

I am getting this problem:

Type '{ color: string; fontWeight: string; fontSize: number; verticalAlign: string; }' is not assignable to type 'Properties<string | number, string & {}>'.ts(2322) index.d.ts(1842, 9): The expected type comes from property 'style' which is declared here on type 'DetailedHTMLProps<AnchorHTMLAttributes, HTMLAnchorElement>'

how can fix it and why is the reason of my problem?

It's a little mismatch in typing of TypeScript. You would need to add CSSProperties interface for the style object.

import { CSSProperties } from "react";
const linkStyle: CSSProperties = {
  color: "#8954A8",
  fontWeight: "bold",
  fontSize: 16,
  verticalAlign: "5%"

Working Sample:

Thanks for contributing an answer to Stack Overflow!

  • Please be sure to answer the question. Provide details and share your research!

But avoid

  • Asking for help, clarification, or responding to other answers.
  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.