Question

当路线（反应路线）发生变化时，如何加载或删除与新页面相关的样式？我真的不知道谁负责这个功能，反应或webpack或反应路由器。但是现在，当加载主页时，项目中的所有样式都会加载，我该怎么办？

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 {}

与代码一样，当我访问＆＃39; http://localhost:8080＆＃39;（即主页）时，page1style.css和page2style.css会加载，但我仍然没有访问{{1 }和page1。

Answer 1

像这样改变

Page1：

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

你的代码所做的是加载为通用css，这就是它加载所有内容的原因。这种方式更模块化，更易于处理

如何在路线改变时改变风格？

1 个答案: