반응 라우터가 페이지를 렌더링하지 않습니다

Question

저는 material-ui 및 react-router를 사용하여 라우터가 설정 한 URL을 기반으로 다른 페이지를 렌더링합니다.

나는 다른 파일이 있습니다

1. Main.js - 어떤 기본 표시 Appbar과 바닥 글의 구성 요소입니다. 그리고 사이에 다른 구성 요소를 렌더링해야합니다.
2. App.js - 라우터 설정에 사용됩니다.

   import React from 'react'; 
   import {render} from 'react-dom'; 
   import App from './Main'; // Our custom react component 
   import { hashHistory, Router, Route, IndexRoute, IndexLink, Link } from 'react-router' 
   
   injectTapEventPlugin(); 
   
   render((
       <Router history={browserHistory}> 
       <Route path="/" component={App}> 
   
       </Route> 
       </Router>), document.getElementById('app')); 
   

   Main.js : 내 페이지에서 개별적으로 구성 요소를 렌더링 할 때

   import React from 'react'; 
   import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; 
   import getMuiTheme from 'material-ui/styles/getMuiTheme'; 
   
   import Main from './Theme'; // Our custom react component 
   import FooterPanel from './FooterPanel'; // Our custom react component 
   
   
   
   const muiTheme = getMuiTheme({ 
       fontFamily: 'Roboto, sans-serif', 
       palette: { 
       textColor: Colors.darkBlack, 
       primary1Color: Colors.white, 
       primary2Color: Colors.indigo700, 
       accent1Color: Colors.redA200, 
       pickerHeaderColor: Colors.darkBlack, 
       }, 
       appBar: { 
       height: 60, 
       }, 
   }); 
   
   class App extends React.Component { 
       render() { 
   
       return (
        <MuiThemeProvider muiTheme={muiTheme}> 
   
        <div> 
         <Main /> 
         { this.props.children } 
         <FooterPanel /> 
        </div> 
   
   
   
        </MuiThemeProvider> 
       ); 
       } 
   } 
   
   export default App; 
   

   동일한 코드가 잘 작동

다음는 코드입니다. 그러나 반응 라우터를 사용하는 동안 아무 것도 표시하지 않습니다.

코드에 아무 것도 없습니까? 콘솔에도 오류가 없습니다. 따라서 오류를 디버깅 할 수 없습니다. 제발 도와주세요.

Answer 1

hashHistory 대신 browserHistory을 가져 오십시오. react-router입니다.

어쨌든 사용할 내역 유형을 모르는 경우 반응 라우터의 history 문서를 확인하여 더 나은 통찰력을 얻으십시오. 그러면 어느 것이 가장 적합한 지 확인할 수 있습니다.