React JSX中花括号{}如何正确运用及详细解析？

本文共计1505个文字，预计阅读时间需要7分钟。

目录 + JSX概述 + 1. 在JSX中使用{ } + 2. JSX中的嵌套标签 + 3. { }中的样式和事件处理 + 4. JSX中的语句使用

目录

• JSX概述
• 1.在JSX中使用{ }
• 2.在JSX中嵌套标签
• 3.{}中的样式和事件处理
• 4.在JSX中使用语句

JSX概述

　　由于通过React.createElement()方法创建的React元素代码比较繁琐，结构不直观，无法一眼看出描述的结构，不优雅，开发时写代码很不友好。

　　React使用JSX来替代常规的JavaScript，JSX可以理解为的JavaScript语法扩展，它里面的标签申明要符合XML规范要求。