反应路线不渲染任何东西

Question

在我的App.js文件中，我有一些路线。

import React, { Component } from 'react';
import './styles/app.css';
import { Route } from 'react-router-dom';
import Welcome from './welcome';
import Discover from './discover';
import Test from "./test";
import { modelInstance } from './model/model'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      title: '',
    }
  }

  render() {
    return (
      <MuiThemeProvider>
        <div className="App">
          <header className="App-header">
            <h1 className="App-title">{this.state.title}</h1>
            {/* We rended diffrent component based on the path */}
            <Route exact path="/" component={Welcome}/>
            <Route path="/search" component={Discover}/>
            <Route path="/test" component={Test}/>

          </header>
        </div>
      </MuiThemeProvider>
    );
  }
}

export default App;

问题是，除了/之外，它们都不起作用！如果我去，例如，/test，我只是得到一个空白屏幕，即使test.js看起来像这样：

import React, {Component} from "react";
class Test extends Component{
    constructor(){
        super(props);
        this.state = {
            response: "",
        }
    }
    render(){
        return(
          <div>
              Hello! 
          </div>
        );
    }
}

export default Test;

我该怎么办？