ReactJS输出将不呈现给HTML，但在控制台日志中起作用

我有一个search框，更新this.state.chebi_results与一个JSON对象onSubmit（）。 一切似乎工作，除非我尝试呈现输出到HTML。 我试图把我的输出呈现为一个无序列表。 我的控制台日志显示正是我想要的。 为什么HTML不被更新？

chebiResults=()=>{ return( <div className='search_results'> <ul> {this.state.chebi_results.forEach((element)=>{ <li>{element.name}</li> console.log(element.name) })} </ul> </div> ); } render(){ return ( <div className='ontology_tool'> <div className='wraper'> <div className='search'> <div className='search_tool'> <form onSubmit={this.handleSearch}> <input type="text" name="query" value={this.state.form_query} onChange={this.setQuery}/> <input type="Submit" value="Submit" /> </form> </div> {this.chebiResults()} </div> <div className='selected'> </div> </div> </div> ); } 

Answer 1

Array#forEach不返回任何内容。 用Array#mapreplace你的函数。

 this.state.chebi_results.map((element) => { ... }); 

Answer 2

你应该使用map不是forEach 。

  chebiResults=()=>{ return( <div className='search_results'> <ul> {this.state.chebi_results.map((element)=>{ console.log(element.name); return <li>{element.name}</li>; })} </ul> </div> ); }