Com'è possibile che React ti permetta di scrivere JSX (XML) in javascript senza che venga generato alcun errore? Ho cercato di capovolgerlo, e non sono abbastanza sicuro di come il codice sottostante lo compia.Come funziona il trasformatore JSX React di Facebook?
11
A
risposta
9
Semplice, cerca i tag <script type="text/jsx">
, li analizza, genera il codice javascript corrispondente e lo è eval
.
Questo è il motivo per cui il trasformatore in linea jsx
deve essere utilizzato solo durante lo sviluppo, poiché la scansione del codice jsx
diminuisce le prestazioni della pagina Web. Al momento della distribuzione, è necessario convertire tutto il codice jsx
in js
prima della distribuzione.
Problemi correlati
- 1. React: dynamic import jsx
- 2. casella di controllo indeterminato in React JSX
- 3. PHPStorm JSX/React evidenziazione della sintassi
- 4. Nome tag dinamico in jsx e React
- 5. W3C convalida HTML per file React JSX
- 6. Tag elemento HTML personalizzato in React JSX
- 7. React JSX: Come impostare gli oggetti di scena all'attributo segnaposto
- 8. Inserisci HTML con React Variable Statements (JSX)
- 9. RequireJS + Babel + JSX
- 10. Come coprire i file React jsx a Istanbul?
- 11. Come configurare Electron, Webpack, Babel, React e JSX?
- 12. Come concatenare i componenti JSX in React Native
- 13. Come posso creare componenti in React Native senza usare JSX?
- 14. Come visualizzare i CSS: nessuno in condizioni con React JSX?
- 15. React JSX: Iterazione attraverso un hash e restituzione di elementi JSX per ogni chiave
- 16. Contesto nel framework Jeac React di Facebook
- 17. Come eseguire il rendering di una stringa con JSX in React
- 18. come eseguire il rendering di più bambini senza JSX
- 19. React Rappresentazione lato server Token inatteso, JSX e Babel
- 20. Comunicazione padre-figlio in React (JSX) senza flusso
- 21. Modifica di Visual Studio di JSX
- 22. come aggiungere react jsx come tipo di file javascript in vim e abilitare eslinting, completamento automatico?
- 23. Spiegare il punto interrogativo (?) Utilizzato nel codice ES6/JSX
- 24. React defaultProps non funziona
- 25. Rendering dinamico di un componente React in React 0.12
- 26. ESLint errori sul JSX/reagire
- 27. React Native: perché il padding non funziona?
- 28. Il collegamento React-Router non funziona
- 29. Come usiamo la classe Perf di Facebook React addons?
- 30. Jest non sta eseguendo il pre-elaborazione del mio JSX
Grazie. Apprezzo il vostro aiuto! – SMLMRKHLMS
Grazie per la spiegazione. – Nirus