HTML til JSX-konverterer
Konverter HTML-markup til gyldig React JSX-kode umiddelbart
HTML-inndata
JSX-utdata
Hva er en HTML til JSX-konverterer?
En HTML til JSX-konverterer omgjor standard HTML-markup til gyldig React JSX-syntaks. I JSX ma class bli className og for bli htmlFor.
A lime inn HTML direkte i React-komponenter forårsaker syntaksfeil. Dette verktøyet automatiserer alle nodvendige transformasjoner.
Slik konverterer du HTML til JSX
Folg disse tre trinnene for å konvertere HTML til gyldig React JSX.
Lim inn eller last opp HTML
Lim inn HTML-en din i venstre panel, eller klikk pa Last opp.
Se JSX-utdata
class omdoopes til className og tomme elementer blir selvlukkende.
Kopier eller last ned
Klikk pa Kopier eller Last ned for å lagre som .jsx.
Nar du bruker denne konvertereren
Migrere HTML til React
Konverter eksisterende HTML-maler til JSX for React-prosjekter.
Bruke designermockups
Integrer HTML-mockups fra designere i React-komponenter.
Laere JSX
Se JSX-ekvivalenten for HTML du allerede kjenner.
Konvertere e-postmaler
Konverter HTML-e-postmaler for biblioteker som React Email.
Vanlige sporsmal
Hvorfor blir class className?
I JSX mappes attributter til JavaScript DOM-egenskaper. DOM-egenskapen for class er className.
Hvilke andre attributter omdopes?
for→htmlFor, tabindex→tabIndex, onclick→onClick.
Hvilke tomme elementer blir selvlukkende?
Alle tomme HTML-elementer: <br />, <img />, <input />, osv.
Haandterer den inline-stiler?
style="color:red" blir style={{ color: "red" }}.
Lagres HTML-en min?
Nei. Alt skjer i nettleseren din.
Relaterte verktøy
Flere verktøy for å arbeide med HTML: