Additional searc functionality

This commit is contained in:
Ken Jannette
2018-04-19 16:38:47 -04:00
parent 074e002e7d
commit 3aa3ec38b0
2 changed files with 13 additions and 5 deletions

View File

@@ -11,7 +11,8 @@ class BooksApp extends React.Component {
constructor() { constructor() {
super(); super();
this.state = { this.state = {
books: [] books: [],
results: []
} }
}; };
@@ -35,10 +36,11 @@ class BooksApp extends React.Component {
onSearch = (query) => { onSearch = (query) => {
if (query.length > 3) { if (query.length > 3) {
search(query).then((result) => search(query).then((results) => {
console.log(result)) this.setState({ results })
} })
} }
}
render() { render() {
return ( return (
@@ -55,6 +57,7 @@ class BooksApp extends React.Component {
<Route path='/search' render={() => ( <Route path='/search' render={() => (
<SearchPage <SearchPage
results={this.state.results}
onSearch={this.onSearch} onSearch={this.onSearch}
/> />
)}/> )}/>

View File

@@ -6,6 +6,8 @@ class SearchPage extends Component {
render() { render() {
const onSearch = this.props.onSearch const onSearch = this.props.onSearch
const results = this.props.results
console.log("RESULT ", results[0])
return ( return (
<div className="search-books"> <div className="search-books">
@@ -20,7 +22,10 @@ class SearchPage extends Component {
</div> </div>
</div> </div>
<div className="search-books-results"> <div className="search-books-results">
<ol className="books-grid"></ol> <ol className="books-grid">
</ol>
</div> </div>
</div> </div>
) )