3

This is my newest side project, the netflix clone. I used react-router v4 & autosuggest.

github (https://github.com/kuanhsuh/netflix-clonev2)

demo (http://netflix-clonev2.surge.sh/#/)

However I found a bug, If I’m home the movie show page, the links in my search will not work(after clicking it the show component does not update). I think it has to do with router v4 and redux integration.

I tried the this method, but it still doesn’t work (Programmatically navigate using react router V4).

Here are my nav links and my routes.

Nav.js

import { Link, withRouter } from 'react-router-dom'

...

onSuggestionSelected = (event , { suggestion, history }) => {
  event.preventDefault();
  this.props.history.push('/movie/'+ suggestion.id)
  this.setState({ value: ''});
}
....

Nav.propTypes = {
  history: React.PropTypes.shape({
    push: React.PropTypes.func.isRequired,
  }).isRequired,
};

export default withRouter(connect(mapStateToProps, {fetchSearch})(Nav));

App.js(where my routes are)

<Router>
  <div>
    <Nav />
    <Switch>
      <Route exact path="/" component={MovieList}/>
      <Route path="/movie/:id" component={MovieShow}/>
      <Route component={NotFound}/>
    </Switch>
    <Footer />
  </div>
</Router>

Thanks for you help!! It means a lot for me since I'm still a beginner =)

productioncoder
  • 3,817
  • 2
  • 34
  • 58
Danny Huang
  • 37
  • 1
  • 2

0 Answers0