Oblikovalnik JSX
Oblikujte komponente React in druge JSX s tem oblikovalnikom JSX. Prilepite kodo in orodje jo razčleni kot modul JavaScript z omogočenim JSX, izpiše JavaScript z zamikom dveh presledkov in podpičji ter večvrstične elemente JSX razporedi tako, da so ugnezdene oznake v oklepajih vsaka v svoji vrstici. Napake v sintaksi so prikazane, zato React razvijalci za pregled, odpravljanje napak in dokumentacijo hitro dobijo berljive komponente.
Pogosta vprašanja
Kako deluje oblikovalnik JSX?
Najprej razčleni kodo kot modul JavaScript z omogočenim JSX in jo izpiše v enotnem slogu. Elementi JSX so nato razporejeni po enakih pravilih kot v oblikovalniku HTML, zato so ugnezdene blokovne oznake vsaka v svoji zamaknjeni vrstici.
Kako so zapisani večvrstični elementi JSX?
Če element vsebuje blokovne podrejene elemente, kot so div, section, p, ul ali h1, je vsak podrejeni element v svoji vrstici, celoten element pa je obdan z oklepaji. Elementi, ki se prilegajo v eno vrstico, na primer oznaka posamezne komponente, ostanejo v isti vrstici.
Ali so podprti fragmenti in samodejno zaprte komponente?
Da, fragmenti, zapisani kot <> in </>, ter samodejno zaprte komponente, kot je <Item key={1}/>, so razčlenjeni in ohranjeni. Njihovi atributi in izrazi v zavitih oklepajih se prekopirajo, kot so zapisani.
Kaj se zgodi ob napakah v sintaksi?
Razčlenjevalnik se ustavi in orodje prikaže sporočilo, na primer nepričakovan žeton, namesto da bi vrnilo delno oblikovano kodo. Popravite označeno mesto in znova zaženite oblikovanje.
Kateri slog uporablja del JavaScript?
Bloki so zamaknjeni za dva presledka, vsak stavek je v svoji vrstici, okoli operatorjev so presledki, na koncu stavkov pa so podpičja. Sloga ni mogoče spreminjati.
Ali se komentarji ohranijo?
Da, enovrstični in blokovni komentarji v JavaScript se ohranijo. Komentarji znotraj izrazov JSX ostanejo v zavitih oklepajih.
Ali podpira TypeScript v datotekah TSX?
Ne, označbe tipov niso del slovnice JSX, ki jo razčlenjuje to orodje, zato je TSX s tipi zavrnjen kot sintaktična napaka. Za tipizirano kodo uporabite oblikovalnik TypeScript.
Ali bo oblikovanje spremenilo izris moje komponente?
JavaScript se samo znova izpiše, postavitev JSX pa spremeni presledke med blokovnimi elementi, ki jih React prezre, kadar so v ločenih vrsticah. Če je natančen razmik pomemben, preverite besedilo v vrstici ob oznakah.
Zakaj je izhod ovit v ograjo javascript?
JSX je razširitev jezika JavaScript, zato je rezultat vrnjen kot kodni blok Markdown z oznako javascript. Kopirajte vrstice med ograjama v datoteko .jsx.
Kako velika je lahko moja komponenta?
Do 5 MB kode na zagon; večji vnos je zavrnjen s sporočilom. Izhod je enak možnosti JSX v orodju Code Formatter.