इस टूल के बारे में
HTML से JSX / React कन्वर्टर एक HTML snippet को ब्राउज़र के native DOMParser से पार्स करता है और इसे मान्य JSX के रूप में फिर से serialize करता है, वह सब कुछ ठीक करते हुए जो React को चाहिए। यह पूरी तरह से client-side चलता है, इसलिए आप जो markup पेस्ट करते हैं वह आपकी मशीन पर रहता है। कोई भी HTML पेस्ट करें — एक design export, एक email template, एक component sketch — और JSX पाएँ जिसे आप सीधे एक React फ़ाइल में डाल सकते हैं।
यह rewrite reserved attributes का नाम बदलता है (class बन जाता है className, for बन जाता है htmlFor), बाकी को camelCase करता है — tabindex को tabIndex, maxlength को maxLength, stroke-width को strokeWidth — जबकि data-* और aria-* attributes को अछूता छोड़ता है। img, br, input, और hr जैसे void elements को self-closing (<img />) बनाया जाता है, HTML comments {/* ... */} बन जाते हैं, text में literal braces को {'{'} के रूप में escape किया जाता है, और एक inline style="a:b;c:d" string को camelCased CSS keys वाले एक style={{ a: 'b', c: 'd' }} object में बदला जाता है। disabled जैसे Boolean attributes को एक toggle के साथ bare या ={true} के रूप में निकाला जा सकता है।
fragment आउटपुट चुनें — कई root nodes को स्वतः एक <>...</> fragment में लपेटा जाता है — या full-component आउटपुट, जो JSX को आपके चुने हुए नाम और indentation (2 spaces, 4 spaces, या tabs) वाले एक export default function में लपेटता है। परिणाम पेस्ट करने के लिए तैयार है; क्योंकि parse एक वास्तविक DOM का उपयोग करता है, विकृत nesting को उसी तरह सामान्यीकृत किया जाता है जैसे एक ब्राउज़र करेगा।