循环阵列：ReactJS对象作为React子项无效

Question

render() { 
    var NewsCards = this.state.news.map((b,i)=>{ 
     return(
      <div key={i} className="row"> 
       <div className="col-10"> 
        <img src={b.image} className="img-fluid"/> 
       </div> 
      </div> 
     ) 
    }) 
    return (
     <div className="container-fluid global-container-bottom-padding"> 
      {RenderIf(this.state.loading)(
      <div id="cssload-pgloading"> 
       <div className="cssload-loadingwrap"> 
        <ul className="cssload-bokeh"> 
         <li></li> 
         <li></li> 
         <li></li> 
         <li></li> 
        </ul> 
       </div> 
      </div> 
      )} 
      {RenderIf(!this.state.loading)(
       { NewsCards } 
      )} 
     </div> 
    ); 
} 

不太清楚我在哪里出错了。

编辑：

this.state.news是对象

[ 
    { 
     "image":"imgurl", 
     "link":"imglink" 
    }, 
    { 
     "image":"imgurl", 
     "link":"imglink" 
    } 
] 

Answer 1

的阵列中的问题就在这里，因为你错误地使用object property shorthand syntax创建一个对象字面与NewsCard领域：

{RenderIf(!this.state.loading)(
    { NewsCards } 
)} 

请将您的代码更改为：

!this.state.loading && 
<div> 
    {NewsCards} 
</div> 

或

{RenderIf(!this.state.loading)(
    <div>{NewsCards}</div> 
)} 

作为存在用于准备片段没有支持的是，至少前阵营16.