上次我们主要讨论了React最基本的ReactDOM.render()(
);
现在看看JSX语法
JSX语法就是XML与JS的相结合,HTML 语言直接写在 JavaScript 语言之中,不加任何引号,这就是 JSX 的语法,它允许 HTML 与 JavaScript 的混写;
看一组案例‘
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Document</title> ???<script src="build/react.js"></script> ???<script src="build/react-dom.js"></script> ???<script src="build/browser.min.js"></script></head><body><div id="exam"></div><script type="text/babel"> ??var names=[‘杨幂‘,‘迪丽热巴‘,‘周星‘]; ????ReactDOM.render( ???????????<div> ???????????{ ?????????????????names.map(function(name){ ??????????????????????return <div> Hello ,{name} ??????????????????????</div> ??????????????}) ???????????} ??????????????????????????</div>, ???????????document.getElementById("exam")//此处结束不应该+; ????????); ???</script> ???</body></html>
以上案例我们看出JSX遇到<开头就已HTML解析,遇到{}开头就用JS规则来解析.
’
React之JSX
原文地址:http://www.cnblogs.com/luotianyi/p/7586518.html