我无法更改页面

Question

我希望将页面Movie.js转到页面Details.js。

有电影url中的井号，但没有发生： “http://localhost:8100/search/tt0372784”

我无法解释这个错误：未捕获的SyntaxError：意外的标记<

main.js：

ReactDOM.render(
    <App />, 
    document.getElementById('app') 
); 

Routes.js：

var Routes = React.createClass({ 
    render: function() { 
    return(
     <Router history={browserHistory}> 
      <Route path='/' component={Home} /> 
      <Route path='/contact' component={Contact} /> 
      <Route path='/search' component={Search}> 
       <Route path='/search/:myLink' handler={Details}/> 
      </Route> 
     </Router> 
    ) 
    } 
}); 

个Movie.js：

var Movie = React.createClass({ 
    render: function(){ 
     var link = 'http://www.imdb.com/title/' + this.props.movie.imdbID; 
     var myLink = 'search/' + this.props.movie.imdbID; 

     return(
      <div className="well"> 
       <div className="row"> 
        <h4 className="text-center"> 
         <Link to={myLink} activeClassName="current">{this.props.movie.Title}</Link> 
        </h4> 
       </div> 


      </div>  
     ) 
    }, 
}); 

Details.js：

var Details = React.createClass({ 
    render: function(){ 

     var link = 'http://www.imdb.com/title/' + this.props.movie.imdbID; 

     var title = this.props.movie.Title; 
     var year = this.props.movie.Year; 
     var type = this.props.movie.Type; 
     var poster = this.props.movie.Poster; 
     var imdbID = this.props.movie.imdbID; 

     return(
      <div className="well"> 
       <div className="row"> 
        <div className="col-md-4"> 
         <img className="thumbnail" src={poster} /> 
        </div> 
        <div className="col-md-8"> 
         <h4><a href={this.props.movie.Title}> {title}</a></h4> 
         <ul className="padding"> 
          <li className="list-group-item">Type : {type}</li> 
          <li className="list-group-item">Year Released : {year}</li> 
          <li className="list-group-item">Id imdb : {imdbID}</li> 
         </ul> 
         <a className="btn btn-primary" href={link}>View on IMDB</a> 
        </div> 
       </div> 

       <Movie movie={this.props.Details} key={i} /> 
      </div>  
     ) 
    }, 
}); 

Answer 1

你在你的路由配置有一个错误

<Route path='/search' component={Search}> 
    <Route path='/search/:myLink' handler={Details}/> 
</Route> 

此配置将匹配 “搜索/搜索/ tt0372784”而不是“search/tt0372784”