React jsx的理解

React当中，我们使用JSX来指定React里的模板，可以把JSX理解为一个对象，React中可以在三个地方指定jsx，分别是ReactDOM.render()的参数、function组件的返回值和class组件内render函数的返回值，例如:

在写jsx代码的时候推荐用括号把它们给包裹起来，这样可以防止分号自动插入的bug(官网这样说的，具体也不知道是什么bug=.=)，

jsx经过babel编译后会转化为一个React.createElement()函数，例如

 writer by:大沙漠 QQ:22969969

React.createElement("div", null, /*#__PURE__*/React.createElement(App, null));

我们可以通过https://babeljs.io/repl这个网站去在线转化jsx,看看转化后的结果是什么

我们可以把jsx赋值给某个变量，又或者作为一个函数的参数去执行，例如:

效果如下:

我们在Show这个function组件内将jsx赋值给一个局部变量p，最后在return的时候进行了拼接。