2016-07-04 13 views
0

Neu zu reagieren. Problem beim Rendern untergeordneter Komponenten mit reaktivem Router. Meine App-Komponente wird in Ordnung wiedergegeben. Wenn ich App in der Elternkomponente für Child1 oder Child2 austausche, funktionieren diese auch. Aber meine verschachtelten Komponenten im Router reagieren anscheinend nicht. Was vermisse ich?React Router nicht untergeordneten Komponenten

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')); 

aktualisieren Okay, so kann ich dies mit hashHistory zu arbeiten, aber browserHistory funktioniert nicht. Warum ist das?

+1

verwenden Sie Express? –

+0

Normalerweise. Derzeit lerne ich gerade und ich habe einen Schluck Live-Reload-Server, aber nicht mit Knoten oder Express. So sieht meine URL aus wie http: // localhost: 8000/#/2? _k = 9pug17 Benötigt browserHistory die Seite, die mit Express oder etwas Ähnlichem bedient werden soll? – ceckenrode

+1

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

Antwort

0

Bezug nehmend auf die Antwort im Kommentar zu meiner Frage, wenn Sie browserHistory verwenden, müssen Sie die Dateien von einer * Route mit Express oder was auch immer anderen Server verwendet werden. Wenn Sie Dateien lokal von einem Entwicklungsserver oder einem Server bereitstellen, der nicht für diese Art von Routing konfiguriert ist, müssen Sie hashHistory verwenden.

Verwandte Themen