CODEWITHSUNDEEP
reactjstypescriptreact-scroll
Carlos Curcino
Carlos Curcino

Reputation: 69

Typescript not recognizing HTML property

I'm using TypeScript in my Vite React project. I'm having problems to build my project because of this error, says that the name property doesn't exist. Someone know how I can fix that?

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>'.

The code

<div
  name='contact'
  className='w-full h-screen bg-dark text-white flex justify-center items-center p-4'
>
  ...
</div>

Upvotes: -1

Views: 234

Answers (1)

RubenSmn
RubenSmn

Reputation: 4672

The property name does not exists on a HTMLDivElement

Instead you can use the Element from react-scroll

import { Element } from "react-scroll";

<Element name="contact" className="w-full">
  Scroll to this element
</Element>;

or if you want to scroll to your own element e.g. div, you can use a id

<div
  id="contact"
  className="w-full h-screen bg-dark text-white flex justify-center items-center p-4"
></div>

Upvotes: 1

Related Questions