リアクタールータDomはコンポーネントをレンダリングしません

Question

私は非常に単純なプロジェクトを持っており、リアクションルータdomはコンポーネントをレンダリングしていません。時には、最初のルートのコンポーネントをレンダリングしますが、レンダリングしません。ここで

はApp.jsのためのコードです：

import React, { Component } from 'react'; 
import { Provider } from "react-redux"; 
import { 
    BrowserRouter as Router, 
    Route 
} from "react-router-dom"; 

import store from "./store"; 
import createHistory from 'history/createBrowserHistory'; 

import { IntroJm } from './components/intro/jm'; 
import { IntroNfc } from './components/intro/nfc'; 
import { IntroTxn } from './components/intro/txn'; 

import './assets/sass/main.scss'; 
import './static/css/main.scss'; 
import './static/css/pure.min.scss'; 
import './App.scss'; 

let browserHistory = createHistory(); 

class App extends Component { 

    componentDidMount() { 
    browserHistory.push("/intro/jm"); 
    } 

    render() { 
    return (
     <Provider store={store}> 
     <div> 
      <Router> 
      <div> 
       <Route path="/intro/jm" component={IntroJm} /> 
       <Route path="/intro/nfc" component={IntroNfc} /> 
       <Route path="/intro/txn" component={IntroTxn} /> 
      </div> 
      </Router> 
     </div> 
     </Provider> 
    ); 
    } 
} 

export default App; 

すべてのルートコンポーネントのみspanタグを持つ単純なコンポーネントです。

は

Answer 1

あなたはWithRouterを使用してコンポーネントをラップして、動作していない

import React, { Component } from 'react'; 
import { Provider } from "react-redux"; 
import { 
    BrowserRouter as Router, 
    Route 
} from "react-router-dom"; 
import {withRouter} 'react-router'; 

import store from "./store"; 

import { IntroJm } from './components/intro/jm'; 
import { IntroNfc } from './components/intro/nfc'; 
import { IntroTxn } from './components/intro/txn'; 

import './assets/sass/main.scss'; 
import './static/css/main.scss'; 
import './static/css/pure.min.scss'; 
import './App.scss'; 

let browserHistory = createHistory(); 

class App extends Component { 

    componentDidMount() { 
    this.props.history.push("/intro/jm"); 
    } 

    render() { 
    return (
     <Provider store={store}> 
     <div> 
      <Router> 
      <div> 
       <Route path="/intro/jm" component={IntroJm} /> 
       <Route path="/intro/nfc" component={IntroNfc} /> 
       <Route path="/intro/txn" component={IntroTxn} /> 
      </div> 
      </Router> 
     </div> 
     </Provider> 
    ); 
    } 
} 

export default withRouter(App);