javascript - Hur man använder href i HTML span när man använder TSX-syntax?

Jag är ny på att använda Typescript och React, så ursäkta om detta är en nybörjarfråga. I min kod har jag följande rad:

<p><span href="#" id="nsTool" style={{color:"white", width: "50px"}}> Namespace </span></p>

Detta fungerade ursprungligen bra när koden bara använde Javascript/React men när jag konverterade filen till en .tsx (Typescript), fick jag följande fel:

Type '{ children: string[]; href: string; id: string; style: { color: string; width: string; }; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>'.
  Property 'href' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>'.

Betyder detta att jag inte kan använda href i span-elementet? Hur kan jag lösa detta?

Svar #1

HTML span-element tillåter endast globala attribut. Så href-attributet kommer inte att ha någon effekt på span och därför får du ett Typescript-fel.

Observera: href-attributet finns vanligtvis endast på ett ankarelement

Svar #2

<span>-taggen har ingen href-attribut. Du kan lägga till span-taggen med en ankartagg på detta sätt:

<span>
    :&nbsp; 
    <a href="#">
        Namespace
    </a>
</span>