Quando clico em um item do menu não mostra o conteúdo

Bom dia, utilizei a extensão Router para fazer o menu, porém quando clico no item do menu, ele muda a URL mas não mostra nada na tela. Segue o código:

import React, {Component} from 'react';

export default class Product extends Component{
    render(){
        return(

<form>
<div class="form-row align-items-center">
  <div class="col-auto">
    <label class="sr-only" for="inlineFormInput">Name</label>
    <input type="text" class="form-control mb-2 mb-sm-0" id="inlineFormInput" placeholder="Jane Doe"/>
  </div>
  <div class="col-auto">
    <label class="sr-only" for="inlineFormInputGroup">Username</label>
    <div class="input-group mb-2 mb-sm-0">
      <div class="input-group-addon">@</div>
      <input type="text" class="form-control" id="inlineFormInputGroup" placeholder="Username"/>
    </div>
  </div>
  <div class="col-auto">
    <div class="form-check mb-2 mb-sm-0">
      <label class="form-check-label">
        <input class="form-check-input" type="checkbox" /> Remember me
      </label>
    </div>
  </div>
  <div class="col-auto">
    <button type="submit" class="btn btn-primary">Submit</button>
  </div>
</div>
</form>

        )
    }
}

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import Product from './components/Product';
import {BrowserRouter as Router, Route, Switch} from 'react-router-dom';

ReactDOM.render(
    (<Router>
        <App>
            <Switch>
                <Route exact path="/" />
                <Route path="/cadastroProduto" component={Product}/>
            </Switch>
        </App>
    </Router>),
    document.getElementById('root')
)