一.基本概念
React 使用 JSX 来替代常规的JavaScript。
JSX 是按照 XML 语法规范 的 JavaScript 语法扩展。
JSX 语法的本质：并不是直接把 JSX 渲染到页面上，而是内部先转换成了 createElement 形式，再渲染的。
二.jsx优点
1.JSX 执行更快，因为它在编译为 JavaScript 代码后进行了优化；
2.它是类型安全的，在编译过程中就能发现错误；
3.使用 JSX 编写模板更加简单快速。
三.jsx基本使用
1.定义虚拟DOM时不要用引号
let VDOM = <h1>hello,react</h1>
2.标签混入JS表达式需要用{ }
let str = "hello,react!"; let VDOM = ( <h1><span>{str}</span></h1> )
3.className样式的类名
let VDOM = ( <h1 className='demo'><span>hello,react!</span></h1> )
4.内联样式用style={{}}
let VDOM = ( <h1 className='demo'><span style={{color:'blue',fontSize:'30px'}}>hello,react!</span></h1> )
5.只有一个根标签
// 定义虚拟dom const VDOM =( <div> <p style={{color:'green',fontSize:'20px'}}>姓名:react</p> <p className="myage">年龄:18</p> </div> ) ReactDOM.render(VDOM, document.getElementById('root'));
6.标签必须闭合
<input type="text" name="" value=""></input>
7. 标签首字母
1.若小写字母开头,则将该标签转为html中同名元素,若html中无该标签对应的同名元素,则报错。
2.若大写字母开头,react就去渲染对应组件,若组件没有定义,则报错。
