Jsx语法规则

• 1.创建虚拟DOM，不要加引号 const VDOM = <h1>hello,react<h1/>✅
  const VDOM ='<h1>hello,react<h1/>'❎
• 2.样式标签中混入 js 表达式,不能写 js 代码要用花括号{}，例如：

const myId = 'testId'
const VDOM = 
<div>
    <h1 id = {myId} style = {{color:'yellow'}}>
        hello,react
    <h1/>
<div/>

• 2.1 js 表达式和 js 语句的区别

表达式：表达式是值、变量和运算符的组合
一个表达式可以产生一个值，有可能是运算、函数的调用、有可能是字面量。表达式可以放在任何需要值的地方。
变量：a
算数表达式：1+2，a+b
包含变量的表达式：x + 2
赋值表达式： x=2
逻辑表达式： 5>2
三元表达式： 5>2 ? true:false
函数调用：function test()
数组方法：arr.map()

语句：
JavaScript语句由以下构成: 值、运算符、表达式、关键字和变量名。这5项不是必须同时存在。
语句可以理解为一个行为，循环语句和判断语句就是典型的语句。一个程序由很多的语句组成，一般情况下一个分号；分割一个一个的语句。例如：
if();
for(){};
switch(){case:xxx}

• 3.样式类名不要用 class，用 className

• 4.虚拟 dom 只能有一个根标签，通常用<div><div/>包裹

• 5.标签必须闭合

• 6.标签首字母

• 1）小写时，自动与 html 标签比对，若匹配不上，则报错

• 2）大写时，react 将其默认为组件