I started using React with Typescript and I'm trying to add a "name" property to a "div" but Typescript is plaining about that and won't allow me to add it because that property doesn't exist.

This is the full message I get back:

Type '{ children: Element[]; name: string; className: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
  Property 'name' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.ts(2322)

How can I solve it? Here is an example of the .tsx file:

import React from "react";

export default function TestComponent() {
    return <div name="ponent-name">Test</div>;
}

I'm using the library react-scroll that requires a name property on the ponent.

I started using React with Typescript and I'm trying to add a "name" property to a "div" but Typescript is plaining about that and won't allow me to add it because that property doesn't exist.

This is the full message I get back:

Type '{ children: Element[]; name: string; className: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
  Property 'name' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.ts(2322)

How can I solve it? Here is an example of the .tsx file:

import React from "react";

export default function TestComponent() {
    return <div name="ponent-name">Test</div>;
}

I'm using the library react-scroll that requires a name property on the ponent.

• javascript
• html
• reactjs
• typescript

• 1 Delete name="ponent-name" from the source code.