Convertor HTML în JSX
Lipește HTML și obține JSX React curat — class devine className, atributele devin camelCase, șirurile style devin obiecte, iar etichetele se auto-închid. Rulează în întregime în browserul tău. Gratuit.
Totul rulează în browserul tău — codul tău nu îți părăsește niciodată dispozitivul.
1
Despre Convertor HTML în JSX
Convertorul HTML în JSX transformă marcajul HTML simplu în JSX pregătit pentru React, în timp real. Rescrie class în className și for în htmlFor, transformă în camelCase atributele cu cratimă și cele SVG, convertește string-urile de style inline în obiecte style JSX și auto-închide elementele void precum img și br — exact editările pe care altfel le-ai face manual.
Lipește un fragment, o secțiune întreagă de pagină sau marcaj exportat dintr-un instrument de design, iar panoul JSX se actualizează pe măsură ce tastezi, cu evidențiere de sintaxă. Un wrapper opțional transformă rezultatul într-o componentă funcție numită, astfel încât rezultatul se integrează direct într-un proiect React fără alte modificări.
Convertorul este un instrument HTML în JSX complet client-side: marcajul tău este transformat de JavaScript în browserul tău și nu părăsește niciodată dispozitivul, ceea ce îl face sigur de folosit cu șabloane proprietare și pagini interne.
Cum să utilizați Convertor HTML în JSX
- Lipește HTML-ul tău în panoul din stânga sau apasă Sample pentru a încărca un exemplu.
- Urmărește panoul JSX actualizându-se instant pe măsură ce tastezi sau editezi.
- Comută Wrap in a component și setează un nume de componentă dacă vrei o componentă funcție gata de folosit.
- Apasă Copy pentru a prelua JSX-ul, sau Download pentru a-l salva ca Component.jsx.
- Folosește Clear pentru a reseta ambele panouri și a converti alt fragment.