Wie ändert man die Stile, wenn sich die Route ändert?

Question

Wie kann ich beim Ändern der Route (react-route) die für die neue Seite relevanten Stile laden oder entfernen? Ich weiß wirklich nicht, wer für diese Funktion zuständig ist, reagiere oder webpack oder react-router. Aber jetzt, wenn die Homepage geladen ist, werden alle Stile im Projekt geladen, wie könnte ich tun?

Routes: 

<Router history={hashHistory}> 
<IndexRoute component={HomePage}/> 
<Route path="/page1" component={Page1}/> 
<Route path="/page2" component={Page2}/> 
</Router> 

Page1: 

import './page1style.css'; 
export default class Page1 extends React.Component {} 

Page2: 
    import './page2style.css'; 
    export default class Page2 extends React.Component {} 

Wie der Code, wenn ich 'http://localhost:8080' (das heißt HomePage) besuchen, page1style.css und page2style.css wird geladen, aber ich besuche noch nicht page1 und page2.

Answer 1

ändert es wie dies

Seite1:

import style from './page1style.css'; 
export default class Page1 extends React.Component { 
    render() { 
    return <div className={style.someClass} /> 
    } 
} 

, was Ihr Code tut, ist als allgemeine CSS zu laden und das ist, warum es alles davon laden. Auf diese Weise wäre modular aufgebaut und leicht