React return的写法

菜鸟教程用的是 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>)



评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值