React Router does not work, always shows the same component

routes.js

import React from 'react';   
    import App from './App';
    import Home from './home/contenedor/home';
    import Logueado from './logueado/contenedor/logueado';
    import { Route, Switch, Miss } from 'react-router-dom';
    const AppRoutes = () => (
          <App>
            <Switch>
              <Route exact path="/" component={Home} />
              <Route path="/logueado" component={Logueado}/>
            </Switch>
          </App>
    )
    export default AppRoutes;

When I enter / logged the home appears and it does not matter what / xx it always shows the home. I need that when I put / logged the component appears but always appears the one of the home

app.js

    import React, { Component } from 'react';
import logo from './logo.svg';
import style from './css/main.css';
import Home from './home/contenedor/home';
import PropTypes from 'prop-types'

class App extends Component {
  static propTypes = {
    children: PropTypes.object.isRequired
  };

  render() {
    const { children } = this.props;
    return (
      <div>
        <Home Style={style}/>
      </div>
    );
  }
}

export default App;

index.js

import React from 'react';
import { render } from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import { BrowserRouter as Router } from 'react-router-dom';
import AppRoutes from './routes';
render(
<Router>
    <AppRoutes/>
</Router>, 
document.getElementById('root'));
registerServiceWorker();

Thanks for the help