React JSX 优势:
- 执行更快
- 类型安全,可以在编译过程中发现错误
- 写法更加简单
JSX 语法:
样例:var myJSXElement=<div>hello word!</div>
这样一个直接把标签元素直接给一个变量的 就是jsx语法
需要用data-前缀。
<p data-myattribute=“hhh”>hello!</p>
需要用{}包裹
<p>{1+1}</p>
不可以用if else 可以用三目
<p>{ i==1?’是’:’否'}</p>
推荐使用内联样式,
var myStype={fontSize:100,color:’red’} <p stype={myStype}>hello</p>
也可以使用行内样式
<p stype={{fontSize:100,color:’red'}}>hello</p>
在标签内的注释 要写在{}内
<div>{/*这是注释*/}</div>
可以将标签写在一个数组里,渲染的时候会自动展开所有成员
var arr=[
<h1>标题一</h1>
<h2>标题二</h3>
]
ReactDOM.render(
<div>{arr}</div>,
Document.getElementById(‘example’)
)