jsx介绍以及语法总结

jsx介绍

1.jsx全称：javaScriptXML

XML：早期用于存储和传输数据，比如用标签的方式

  Ton
  19  

缺点：实际值只有Ton,19 却要写这么多，后来更倾向于JSON格式

 {
      "name":Ton,
      "age":20
    }

2.react定义的一种类似于XML的JS扩展语法: JS + XML本质是React.createElement(component, props, ...children)方法的语法糖

3.作用：用来简化创建虚拟DOM

1. 写法：var ele = 

   Hello JSX

2. 注意1：它不是字符串, 也不是HTML/XML标签
3. 注意2：它最终产生的就是一个JS对象

JSX基本语法规则

 1、定义虚拟dom时不要写引号(因为不是字符串)

 2、标签中混入js表达式要用{}

 3、内联样式，要用style={{key:value}}的形式去写

 4、样式的类名指定不要class,要用calssName（因为要区别与es6的class类）

 5、虚拟dom只有一个根节点

 6、标签必须闭合

 7、标签首字母

          (1)若小写字母开头，则将改标签转为html中同名元素，若html中无该标签对应的同名元素，则报错

          (2)若大写字母开头，react就去渲染对应的组件,若组件没有定义，则报错