HTML-indata

JSX-utdata

Vad ar en HTML till JSX-konverterare?

En HTML till JSX-konverterare omvandlar standard HTML-markering till giltig React JSX-syntax. I JSX maste class bli className och for bli htmlFor.

Att klistra in HTML direkt i React-komponenter orsakar syntaxfel. Det har verktyget automatiserar alla nodvandiga omvandlingar.

Hur man konverterar HTML till JSX

Folj dessa tre steg for att konvertera HTML till giltig React JSX.

Klistra in eller ladda upp HTML

Klistra in din HTML i det vanstra panelen eller klicka pa Ladda upp.

Visa JSX-utdata

class byter namn till className och tomma element blir sjalvstangande.

Kopiera eller ladda ner

Klicka pa Kopiera eller Ladda ner for att spara som .jsx.

Nar man anvander denna konverterare

Migrera HTML till React

Konvertera befintliga HTML-mallar till JSX for React-projekt.

Anvanda designermockups

Integrera HTML-mockups fran designers i React-komponenter.

Lara sig JSX

Se JSX-motsvarigheten for HTML du redan kanner till.

Konvertera e-postmallar

Konvertera HTML-e-postmallar for bibliotek som React Email.

Vanliga fragor

Varfor blir class className?

I JSX mappas attribut till JavaScript DOM-egenskaper. DOM-egenskapen for class ar className.

Vilka andra attribut byter namn?

for→htmlFor, tabindex→tabIndex, onclick→onClick.

Vilka tomma element blir sjalvstangande?

Alla tomma HTML-element: <br />, <img />, <input />, etc.

Hanterar det inline-stilar?

style="color:red" blir style={{ color: "red" }}.

Lagras min HTML?

Nej. Allt sker i din webblesare.

Relaterade verktyg

Fler verktyg for att arbeta med HTML: