Share
Wat je gaat creërenJSX is vergelijkbaar met een mix van XML en HTML. U gebruikt JSX binnen de React-code om eenvoudig componenten voor uw apps te maken. JSX transformeert in JavaScript wanneer React de code compileert.
Het mooie van React is dat je herbruikbare code kunt maken en je app gemakkelijk kunt structureren vanuit een op componenten gebaseerde mindset. Ten slotte is de kloof tussen het bespotten van wireframes van semantisch gevormde ideeën en het implementeren ervan nooit dichterbij geweest.
Hier is een voorbeeld van hoe JSX HTML rendert:
js var div = ; ReactDOM.render (div, document.getElementById ('example'));
Gebruik een lokale variabele die begint met een component om een component te maken hoofdletter, bijv .:
"js var MyComponent = React.createClass (/... /); var myElement =
ReactDOM.render (myElement, document.getElementById ('example')); "
Opmerking: Er zijn gereserveerde woorden in JSX, omdat het in wezen toch JavaScript is, dus trefwoorden zoals klasse en voor worden ontmoedigd als attribuutnamen. In plaats daarvan verwachten componenten van React de eigenschapnamen van React, zoals naam van de klasse en htmlFor, bijvoorbeeld.
Specificeer kinderen in uw JSX als volgt:
"js var Gebruiker, Profiel;
// U schrijft in JSX: var app =
// Wat wordt uitgevoerd in JS: var app = React.createElement (Gebruiker, className: "vip-user", React.createElement (Profile, null, "click")); "
Gebruik de Babel REPL om JSX uit te testen.
Het maken van formulieren is eenvoudig met JSX en subcomponenten, bijvoorbeeld:
"js var Form = FormComponent;
var App = (
Accentsconagua