在jsx中直接寫插值表達(dá)式僵芹,是以tostring的方式展現(xiàn)出來。
<!DOCTYPE html>
<html>
<head>
<script src="../build/react.js"></script>
<script src="../build/react-dom.js"></script>
<script src="../build/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">
var users = ['a','b','c']
ReactDOM.render(
<div>
<ul>
<li>{users}
</li>
</ul>
</div>,
document.getElementById('example')
);
</script>
</body>
</html>
那么,如果我們想根據(jù)數(shù)組內(nèi)容生成一個(gè)包含有結(jié)構(gòu)的新數(shù)組谐宙,怎么辦呢?
<!DOCTYPE html>
<html>
<head>
<script src="../build/react.js"></script>
<script src="../build/react-dom.js"></script>
<script src="../build/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">
var users = ['a','b','c']
ReactDOM.render(
<div>
<ul>
{users.map((user,index)=>{
return <li key={index}>{user}</li>
})
}
</ul>
</div>,
document.getElementById('example')
);
</script>
</body>
</html>