반응 라우터가 매개 변수와 함께 작동하지 않음

반응 라우터가 매개 변수와 함께 작동하지 않음

다음과 같은 설정이 있다.

<div>
    <Router history={browserHistory}>
        <Route path="/" component={NewCustomerContainer} />
        <Route path="/newCustomer" component={NewCustomerContainer} />
        <Route path="/search" component={SearchPageContainer} />
        <Route path="/network" component={NetworkContainer} />
        <Route path="/network/:id" component={NetworkContainer} ></Route>
    </Router>
</div>

경로http://localhost:8100/network효과가 좋다경로http://localhost:8100/network/abc123콘솔에 404 오류가 나타나는 경우전에 이런 거 본 사람 있어?

다른 시도를 할 수 있는 것은 a를 추가하는 것이다.

<base href="/">

기본 HTML 페이지의 머리 태그 내부에 태그를 추가하십시오.

<div>
    <Router history={browserHistory}>
        <Route path="/" component={NewCustomerContainer} />
        <Route path="/newCustomer" component={NewCustomerContainer} />
        <Route path="/search" component={SearchPageContainer} />
        <Route path="/network" component={NetworkMetaContainer}>
            <Route path="/:id" component={NetworkContainer}/>
        </Route>
    </Router>
</div>

네트워크 경로 내부에 '/id'를 중첩하는 것을 잊으셨습니다.반응 라우터는 다른 경로 내에 경로를 배치하여 중첩된 라우팅을 허용...만약 당신이 네트워크 내부에 모든 네트워크/아이드를 가지고 있고 네트워크가 그것의 자식들을 렌더링한다면, 이것은 제대로 작동할 것이다.

새로운 NetworkMetaContainer는 단순한 렌더링 아동을 가진...아니면 당신이 원하면 당신은 아마도<IndexRoute />네트워크 경로 내, 그러나 어느 쪽이든 NetworkMetaContainer 사물은 외부 포장자여야 한다(네트워크 내부에 다른 탭이나 링크 또는 가능성이 있을 수 있음)?

소품을 달려고 하다exact={true}안쪽에Route구성 요소

<div>
    <Router history={browserHistory}>
        <Route path="/" component={NewCustomerContainer} />
        <Route path="/newCustomer" component={NewCustomerContainer} />
        <Route path="/search" component={SearchPageContainer} />
        <Route path="/network" exact={true} component={NetworkContainer} />
        <Route path="/network/:id" exact={true} component={NetworkContainer} ></Route>
    </Router>
</div>

react-reason-dom https://reactrouter.com/web/guides/primary-components을 사용하고 있는 것으로 가정해 보십시오.

다른 경로보다 더 구체적인 경로를 먼저 선택하십시오.

<Route path="/posts/:id" exact>
  <Post />
</Route>
<Route path="/posts">
  <Posts />
</Route>

이 두 노선이 어떻게 주문되는지 주의하십시오.보다 구체적인 경로="/contact/:id"는 경로="/contact"보다 먼저 나타나므로 개별 연락처를 볼 때 경로가 렌더링된다.

Base href는 나에게 통하지 않았다.그러나 다음과 같은 이점이 있었다.

<Router history={browserHistory}>
   <Route path={['/network/:id', '/network']} component={NetworkContainer} />
</Router>

참조URL: https://stackoverflow.com/questions/42906858/react-router-not-working-with-params