ReactDOM.render(componentToRender, targetNode)
, donde el primer argumento es el elemento o componente React que desea procesar y el segundo argumento es el nodo DOM que desea hacer que el componente. Como es de esperar, se debe llamar a ReactDOM.render()
después de las declaraciones del elemento JSX, tal como se deben declarar las variables antes de usarlas. ReactDOM.render()
para procesar este componente en la página. Puede pasar los elementos JSX definidos directamente como primer argumento y usar document.getElementById()
para seleccionar el nodo DOM para representarlos. Hay un div
con id='challenge-node'
disponible para que lo uses. Asegúrate de no cambiar la constante JSX
. JSX
debe devolver un elemento div
.
testString: 'assert(JSX.type === "div", "The constant JSX
should return a div
element.");'
- text: El div
debe contener una etiqueta h1
como el primer elemento.
testString: 'assert(JSX.props.children[0].type === "h1", "The div
should contain an h1
tag as the first element.");'
- text: El div
debe contener una etiqueta p
como el segundo elemento.
testString: 'assert(JSX.props.children[1].type === "p", "The div
should contain a p
tag as the second element.");'
- text: El elemento JSX proporcionado se debe representar en el nodo DOM con id challenge-node
.
testString: 'assert(document.getElementById("challenge-node").childNodes[0].innerHTML === "Lets render this to the DOM
", "The provided JSX element should render to the DOM node with idchallenge-node
.");'
```
Lets render this to the DOM