2017-10-04 32 views
0

我想输出只使用lodash的_.find函数的第一个数组。这在我console.log结果时有效。不过,我努力将其输入到渲染中,以便我可以在我的JSX中显示结果。React JS使用lodash渲染数组项目

我已经尝试了很多提取数组的方法,但还没有找到一个成功的结论。任何帮助解决这个问题,并解释如何做到这一点将不胜感激。

两个const(事件)不同时运行,顶端是我正在尝试运行的一个,第二个正在工作,但迭代通过这两个数组并在屏幕上显示两组信息。

const cat = _.find(this.state.event, function(o) { return o.id == 1; }); 
    console.log(cat); 

    //const events = _.find(this.state.event, ['id':1] (=> { 
    const events = this.state.event.map((item, i) => { 
    return <div> 
    <div className="center-cards margin-top margin-bottom test-cardSecond"> 
     <div className="text-center margin-top"> 
     <h1 className="card-heading">Scottish Conference 2017</h1> 
     <div className="card-sub"> 
      <div>{item.description}</div><br /> 
      {/* <div>Sale Date</div><div>{item.sales_end_time} - {item.sales_start_time}</div><br /> */} 
     </div> 
     </div> 
    </div> 
     <div className="belowBoxTestSecond"> 
     <h1 className="bodyHeading">Example</h1> 
     <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. <br /><br /> 
     Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. <br /> 
     Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. <br /> 
     Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? <br /><br /> 
     Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?</p> 
     </div> 
    </div> 
    }); 
+0

猫是一个对象,你cann不需要自己渲染。你可以使用点符号'{cat.id}'来打印猫的字段,它将打印猫的ID。花括号是必需的。 – fungusanthrax

回答

1

按照lodash.find documentation,使用简写匹配的属性值正确的方法是:

_.find(myArray, ['property', value]); 

_.find(myArray, {'property': value}); 

所以你的代码应该是:

const events = _.find(this.state.event, ['id', 1 ]).map(item => { 

});