Question 1

Τι κάνει ο μετατροπέας HTML σε JSX;

Accepted Answer

Μετατρέπει συνηθισμένο markup HTML σε JSX που μπορεί να αποδώσει το React. Επικολλήστε το HTML στην περιοχή εισόδου και το αντίστοιχο JSX εμφανίζεται στο πάνελ εξόδου, ενημερωμένο καθώς πληκτρολογείτε με μικρή καθυστέρηση.

Question 2

Ποια χαρακτηριστικά μετονομάζονται;

Accepted Answer

Το class γίνεται className, το for γίνεται htmlFor, το tabindex γίνεται tabIndex, και άλλα χαρακτηριστικά με παύλα όπως maxlength, colspan ή stroke-width παίρνουν τα camelCase ονόματα του React. Τα data-* και aria-* μένουν ως έχουν.

Question 3

Πώς μετατρέπεται το χαρακτηριστικό style;

Accepted Answer

Ένα CSS string όπως style="background-color: red; font-size: 12px" γίνεται αντικείμενο JavaScript: style={{backgroundColor:'red', fontSize:'12px'}}, με κάθε ιδιότητα CSS σε camelCase και την τιμή σε εισαγωγικά.

Question 4

Πώς χειρίζονται τα void στοιχεία;

Accepted Answer

Τα στοιχεία που δεν μπορούν να έχουν παιδιά — img, br, input, hr, meta, link και λοιπά — κανονικοποιούνται σε αυτοκλεινόμενη σύνταξη: το γίνεται , ακριβώς όπως απαιτεί το JSX. Κενά div και span κλείνουν με τον ίδιο τρόπο.

Question 5

Τι γίνεται με τα σχόλια HTML;

Accepted Answer

Μετατρέπονται σε σχόλια JSX:  γίνεται {/* σημείωση */}. Ακολουθίες που θα έκλειναν το σχόλιο πρόωρα εξουδετερώνονται, ώστε ο παραγόμενος κώδικας να μεταγλωττίζεται πάντα.

Question 6

Πώς χειρίζονται τα entities και οι ειδικοί χαρακτήρες;

Accepted Answer

Τα entities όπως & ή &copy; αποκωδικοποιούνται σε πραγματικούς χαρακτήρες και μετά τα άγκιστρα και οι γωνίες κάνουν εκ νέου escaping με ασφαλή μορφή για JSX, ώστε κείμενο με { } ή < να αποδίδεται σωστά χωρίς να σπάει το component.

Question 7

Τι κάνει η επιλογή function component;

Accepted Answer

Τυλίγει το μετατραπέν markup σε έτοιμο πρότυπο: function Component() { return ( ...το JSX σας... ) } αντί για γυμνό JSX. Ενεργοποιήστε το για να επικολλήσετε το απόσπασμα κατευθείαν σε αρχείο React.

Question 8

Στέλνεται το HTML μου κάπου;

Accepted Answer

Όχι. Η ανάλυση γίνεται εξ ολοκλήρου στον browser σας με τον ενσωματωμένο DOMParser. Τίποτα δεν αποστέλλεται σε server, οπότε ιδιωτικό markup μετατρέπεται με ασφάλεια, και το εργαλείο λειτουργεί και εκτός σύνδεσης.

Μετατροπέας HTML σε JSX

Πώς να χρησιμοποιήσετε το Μετατροπέας HTML σε JSX