- Objective: - Breadcrumb: # 概念阐释 ## 语义 JavaScript变量可被引入[[JSX Elements]]中。 ## 语法 ```jsx const name = 'Gerdo'; const greeting = <p>Hello, {name}!</p>; ``` # 实例 # 相关内容 # 问题 将变量作为`h1`标题 ```js import ... import {creatRoot} from ... const container =... const root = ... const theBestString = 'This text was accessed through a javascript variable'; root.render(...) ``` # 问题答案 ```js import React from 'react'; import { createRoot } from 'react-dom/client'; const container = document.getElementById('app'); const root = createRoot(container); const theBestString = 'This text was accessed through a javascript variable'; root.render(<h1>{theBestString}</h1>); ``` # 参考资料 [Variables in JSX-codecademy](https://www.codecademy.com/journeys/full-stack-engineer/paths/fscj-22-front-end-development/tracks/fscj-22-react-part-i/modules/wdcp-22-jsx-752c2293-9f61-412a-92e2-70ad6e01a0a7/lessons/react-jsx-advanced/exercises/jsx-variables)