issue with refresh

react-bootstrap

import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';
import ReactDOM from 'react-dom';

import { Button, Jumbotron, Form, Col, FormGroup, FormControl, ControlLabel, InputGroup, Overlay, Tooltip, Popover } from 'react-bootstrap';


class ViewHome extends Component {
	constructor(props) {
		super(props);
		this.state = {};

		// bind this
		this.handleOnClick = this.handleOnClick.bind(this);
	}

	render() {
		let { email } = this.state;

		return (
			<div>
				<Jumbotron>
					<div>
						<h1>Blah.</h1>
						<p>Content here.</p>
					</div>
					<Form horizontal>
						<FormGroup>
							<Col sm={10}>
								<InputGroup>
									<FormControl type="email" placeholder="Enter email" onChange={ e => this.setState({ email: e.target.value }) } />
										<InputGroup.Button>
											<Button type="submit" submit={ e => this.handleOnClick(e) }>Start Trial</Button>
										</InputGroup.Button>
								</InputGroup>
							</Col>
						</FormGroup>
					</Form>
				</Jumbotron>
			</div>
		);
	}

	/**
	 * validate email address composition
	 */
	handleOnClick(e) {
		console.log("here");
		e.preventDefault();
	}
}

export default ViewHome;