JSX的基础知识

1.JSX基本使用

1.1什么是JSX

JSX 是 JavaScript XML 的简写，表示在 JS 代码中写 XML(HTML) 格式的代码

声明式语法更加直观，与 HTML 结构相同降低学习成本、提高开发效率

1.2使用步骤

1. 使用 JSX 语法创建 react 元素

   const title = <h1>Hello JSX</h1>

2. 使用 ReactDOM.render() 方法渲染 react 元素到页面中

   ReactDOM.render(title,document.getElementById('root'))

2.JSX中使用JS表达式

嵌入 JS 表达式

数据是存储在 JS 中的，语法：{JS表达式}

const age = 19
const title = (<h1>Hello JSX,{ age}</h1>)
ReactDOM.render(title,document.getElementById('root'))