React JSX

React JSX

JSX：全称JavaScript XML
官方说明：JSX执行时实际上会被转换成React.createElement()的形式。所以JSX其实就是一个语法糖，因为写React.createElement实在是太多代码，看着心烦。

JSX的优点

• JSX执行快，它在编译成JS代码后进行了优化
• 在编译过程中就能发现错误
• 使用JSX编写效率更高，它可以在JS中利用标签结构构建视图，代码结构层次清晰，后期也便于维护优化

JSX的缺点

• JSX时JS的一个语法扩展，它有自己的语法规则，浏览器并不识别，所以要借助babel.js来进行编译，让浏览器识别

接下来一起来看一下JSX的基本语法

ReactDOM.render((
	<div>
		123
	</div>
),document.querySelector("#root"));
//第一个参数是需要生成的虚拟DOM，第二个参数是存放DOM的容器

注意 ：在引入React和ReactDOM时，必须要将React写在ReactDOM之前，因为ReactDOM依赖于React