您可以将表达式放在大括号内。请注意,在已编译的Javascript中,为什么
for在JSX语法中永远不可能发生循环;JSX相当于函数调用和加糖的函数参数。仅允许使用表达式。
(此外:请记住将
key属性添加到在循环内渲染的组件。)
JSX + ES2015 :
render() { return ( <table className="MyClassName"> <thead> <tr> {this.props.titles.map(title => <th key={title}>{title}</th> )} </tr> </thead> <tbody> {this.props.rows.map((row, i) => <tr key={i}> {row.map((col, j) => <td key={j}>{col}</td> )} </tr> )} </tbody> </table> );}Javascript :
render: function() { return ( React.DOM.table({className: "MyClassName"}, React.DOM.thead(null, React.DOM.tr(null,this.props.titles.map(function(title) { return React.DOM.th({key: title}, title); }) ) ), React.DOM.tbody(null, this.props.rows.map(function(row, i) { return ( React.DOM.tr({key: i}, row.map(function(col, j) { return React.DOM.td({key: j}, col); }) ) ); }) ) ) );}


