Function component for entry

This commit is contained in:
greg 2019-01-26 01:34:35 -08:00
parent d77e09052a
commit e88c8b954e

25
App.jsx
View File

@ -20,6 +20,19 @@ function testHandler(json) {
console.log(json); console.log(json);
} }
function Entry(props) {
const entry = props.entry;
return (
<div className="searchResult" key={ entry.id }>
<b>{ entry.sai }</b> - { entry.eng }
<br />
<span className="synclass">{ entry.syn_category }</span>
<br />
Type: { entry.morph_type }
</div>
);
}
class Results extends Component { class Results extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
@ -31,15 +44,9 @@ class Results extends Component {
<div className="searchResultHeader"> <div className="searchResultHeader">
Searched for <b>{ this.props.searchTerm }</b> search type: { this.props.searchType } Searched for <b>{ this.props.searchTerm }</b> search type: { this.props.searchType }
</div>); </div>);
const entries = this.props.searchResults.map((entry, idx) => { const entries = this.props.searchResults.map(
return (<div className="searchResult" key={ entry.id }> (entry, idx) => <Entry entry={ entry } key= { entry.id } />
<b>{ entry.sai }</b> - { entry.eng } );
<br />
<span className="synclass">{ entry.syn_category }</span>
<br />
Type: { entry.morph_type }
</div>);
});
return [header].concat(entries); return [header].concat(entries);
} }