菜鸟教程用的是 jsx ,需要经过 babel-react 过的。
知道它的原理就可以了,
因为
return <div></div>
最终会被babel-react 转换成 类似
return createElement('div')
所以 只需要确保 return 的是一个根节点的,像下方这样的是不行的。
return (<div>111</div><div>222</div>) // 错误示范
要用一个div括起来
return (<div>
******
</div>)
如果return 后面没有括号,第一行的内容一定要和return 写在一起
(例子截取自return中间的一部分)
正确例:
return (
<div>
******
{
listspace.map(function(item){
return <tr className="click_item">
<td><Link to={{pathname:"/listrepo", query:{name:item.name},props:{name:item.name}}}>
{item.name}
</Link>
</td>
<td>{item.description}</td>
<td>{item.creator}</td>
</tr>
})
}
</div>)
错误例:
return (
<div>
******
{
listspace.map(function(item){
return
<tr className="click_item">
<td><Link to={{pathname:"/listrepo", query:{name:item.name},props:{name:item.name}}}>
{item.name}
</Link>
</td>
<td>{item.description}</td>
<td>{item.creator}</td>
</tr>
})
}
</div>)