React Router url with params

Question

나는 MeteorJS 프레임 워크에서 React Router를 사용합니다.

/blog/: 슬러그으로 새 슬러그를 만들고 싶습니다만 결과가 없습니다. 내 PostItem 구성 요소 :

class PostsListItem extends Component { 

    render() { 
    return (
     <li className={this.props.post.draft ? 'is-drafted' : ''}> 
     <Link to={`/blog/${this.props.post.slug}`}>{this.props.post.title}</Link> 
     <p>{this.props.post.description}</p> 
     </li> 
    ); 
    } 

} 

내 라우팅 :

class Layout extends React.Component { 
    render() { 
    return (
     <Router> 
     <div> 
      <Header /> 
      <main className="l-main"> 
      <Switch> 
       <Route exact path='/' component={Home} /> 
       <Route path='/blog' component={Blog} /> 
       <Route path='/blog/:slug' component={Article} /> 
       <Route path='/about' component={About} /> 
       <Route path='/contact' component={Contact} /> 
       <Route component={NotFound} /> 
      </Switch> 
      </main> 
      <Footer /> 
     </div> 
     </Router> 
    ); 
    } 
} 

그리고 내 제 구성 요소 (디스플레이 내 /블로그/: 슬러그 URL) :

function Article(props) { 
    return <h1>{props.match.params.name}</h1> 
} 

난 몰라 내 페이지가 표시되지 않는 이유를 이해하십시오. 테스트/블로그/테스트 슬러그라면 부모 경로를 참조하십시오. <Route path='/blog' component={Blog} />

누구나 아시겠습니까?

커뮤니티에 감사드립니다.

Answer 1

귀하의 문제는 당신이이 일을하고 있다는 것입니다 :

이의 대신

<Route path='/blog' component={Blog} /> 
<Route path='/blog/:slug' component={Article} /> 

:

<Route exact path='/blog' component={Blog} /> 
<Route path='/blog/:slug' component={Article} /> 

라우터가 처음 일치하는 URL을 검색합니다. "정확한"속성을 제공하지 않으면 "/ 블로그"가있는 모든 항목이 일치합니다. 그 뒤에 오는 것이 중요하지 않습니다.