Как динамически добавить Route'ы в Реакте?

Я добавил новость и хочу добавить новый Route. Сейчас сделал так, но это не работает:

index.js:

<Provider store={store}>
      <Router history={history}>
        <App/>
      </Router>
    </Provider>,

App.js:

import React, { Component } from "react";
import { Switch, Route, withRouter } from "react-router-dom";
import { fetchStories } from "../ac";
import Header from "./Header/index";
import Dashboard from "./Dashboard/index";
import { connect } from "react-redux";

class App extends Component {
	componentWillMount() {
		this.props.fetchStories();
	}
	render() {
		let { stories } = this.props;
		const routes = stories ? (
			Object.keys(stories).map(element => {
				let url = stories[element].title;
				console.log(url);
				return (
					<Route
						key={stories[element].title}
						path={url}
						render={() => (
							<div className="app">
								<Header />
								<div>new</div>
							</div>
						)}
					/>
				);
			})
		) : (
			<div>loading</div>
		);
		return (
			<Switch>
				<Route
					path="/"
					exact
					render={() => (
						<div className="app">
							<Header />
							<Dashboard stories={this.props.stories} />
						</div>
					)}
				/>
				{/* <Route /> */}
				{routes}
			</Switch>
		);
	}
}

const mapDispatchToProps = {
	fetchStories
};

export default withRouter(
	connect(
		state => ({
			stories: state.stories
		}),
		mapDispatchToProps
	)(App)
);

Когда перехожу по урлу, то получаю белый экран.