reactjs - React routing is not working -

import react 'react'; import reactdom 'react-dom'; import './index.css'; import register './register/register'; import login './login/login'; import {   browserrouter router,   route,   navlink } 'react-router-dom'; import createbrowserhistory 'history/createbrowserhistory' const history = createbrowserhistory()   class app extends react.component {   constructor(props) {     super(props);     this.login = this.login.bind(this);     this.register = this.register.bind(this);   }   login() {     history.push('/')   }   register() {     history.push('/login')   }   render() {     return (       <router>         <div>            <button onclick={this.login}>login</button>           <button onclick={this.register}>register</button>             <route exact path='/' component={register} />           <route path='/login' component={login} />         </div>       </router>      );   } }  reactdom.render(<app />, document.getelementbyid('root')); 

i have 2 pages of login , register,i wanted route these pages calling method above.but url changing page not loading.i searched solutions , followed,but it's not working,please check what's wrong code.thank you

i think forgot bind history router:

<router history={history}>   ... </router>