Getting familiar with JSX
If you recall from the JSX chapters, we can store HTML elements inside JavaScript variables. Let's try storing a simple heading element inside a variable with an embedded name value:
let name = "Mouiz G";
let heading = <h1>Hello, {name}!</h1>
After adding these two lines in the script, we will be able to render the element heading by passing it into the render method of the root instead of the older value:root.render(element);
If you look in the output console, you should be able to see rendered results.
index.html
This task isn't obligatory to complete the course!
Task
On Line 26, create an unordered list having three list items Item 1, Item 2, and Item 3. Store it in a variable called myList. Render it using the root's render function.
Note
You can use the codesandbox window below. Sliding from the right edge will reveal the result (rendered page).
Grazie per i tuoi commenti!
Chieda ad AI
Chieda ad AI
Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione
Can you show me how to create the `myList` variable?
What should I do after creating the `myList` variable?
Can you explain how to render `myList` using the root's render function?
Fantastico!
Completion tasso migliorato a 2.7Getting familiar with JSX
Scorri per mostrare il menu
If you recall from the JSX chapters, we can store HTML elements inside JavaScript variables. Let's try storing a simple heading element inside a variable with an embedded name value:
let name = "Mouiz G";
let heading = <h1>Hello, {name}!</h1>
After adding these two lines in the script, we will be able to render the element heading by passing it into the render method of the root instead of the older value:root.render(element);
If you look in the output console, you should be able to see rendered results.
index.html
This task isn't obligatory to complete the course!
Task
On Line 26, create an unordered list having three list items Item 1, Item 2, and Item 3. Store it in a variable called myList. Render it using the root's render function.
Note
You can use the codesandbox window below. Sliding from the right edge will reveal the result (rendered page).
Grazie per i tuoi commenti!
