2016-07-04 13 views
0

New to react. 반응 라우터가있는 하위 구성 요소를 렌더링하는 데 문제가 있습니다. My App 구성 요소가 잘 렌더링됩니다. Child1 또는 Child2의 부모 구성 요소에서 App을 교체하면 그 구성도 작동합니다. 하지만 반응 라우터 내부에 내 중첩 된 구성 요소가 렌더링되지 않는 것처럼 보입니다. 내가 뭘 놓치고 있니? 좋아React Router가 하위 구성 요소를 렌더링하지 않습니다.

var App = React.createClass({ 
    render: function() { 
    return <h1 className="red"> 
     dfdf 
     {this.props.children} 
    </h1> 
    } 
}); 

var Child1 = React.createClass({ 
    render: function() { 
    return (
     <h1>I am a Child</h1> 
    ) 
    } 
}); 

var Child2 = React.createClass({ 
    render: function() { 
    return (
     <h1>I am the other Child</h1> 
    ) 
    } 
}); 

var routes = (
    <Router history={browserHistory}> 
    <Route path="/" component={App}> 
     <Route path="1" component={Child1} /> 
     <Route path="2" component={Child2} /> 
    </Route> 
    </Router> 
) 

ReactDOM.render(routes, document.querySelector('.container')); 

업데이트 그래서 나는이 hashHistory 작업을 얻을 수 있지만, browserHistory이 작동하지 않습니다. 왜 이런거야?

+1

express를 사용하십니까? –

+0

일반적으로 현재 저는 방금 배우고 있고 꿀꺽 꿀꺽 마시는 라이브 리로드 서버를 운영하고 있지만 노드 나 익스프레스를 사용하지는 않습니다. 따라서 내 URL은 http : // localhost : 8000/#/2? _k = 9pug17와 같습니다. browserHistory에서 페이지를 express 또는 이와 비슷한 형태로 제공해야합니까? – ceckenrode

+1

http://stackoverflow.com/questions/35063095/react-router-browserhistory-not-working-as-expected –

답변

0

내 질문에 대한 답변에 언급 된 답변을 참조하십시오. browserHistory를 사용할 때 express 또는 다른 서버를 사용하여 * 경로에서 파일을 제공해야합니다. 이러한 종류의 라우팅을 위해 구성되지 않은 개발 서버 또는 서버에서 로컬로 파일을 제공 할 때는 hashHistory를 사용해야합니다.

관련 문제