dc10832 Jan 5, 2018
2 contributors

Users who have contributed to this file

@ryanflorence @pshrmn
51 lines (33 sloc) 1.84 KB


A <Router> that uses the hash portion of the URL (i.e. window.location.hash) to keep your UI in sync with the URL.

IMPORTANT NOTE: Hash history does not support location.key or location.state. In previous versions we attempted to shim the behavior but there were edge-cases we couldn't solve. Any code or plugin that needs this behavior won't work. As this technique is only intended to support legacy browsers, we encourage you to configure your server to work with <BrowserHistory> instead.

import { HashRouter } from 'react-router-dom'


basename: string

The base URL for all locations. A properly formatted basename should have a leading slash, but no trailing slash.

<HashRouter basename="/calendar"/>
<Link to="/today"/> // renders <a href="#/calendar/today">

getUserConfirmation: func

A function to use to confirm navigation. Defaults to using window.confirm.

// this is the default behavior
const getConfirmation = (message, callback) => {
  const allowTransition = window.confirm(message)

<HashRouter getUserConfirmation={getConfirmation}/>

hashType: string

The type of encoding to use for window.location.hash. Available values are:

  • "slash" - Creates hashes like #/ and #/sunshine/lollipops
  • "noslash" - Creates hashes like # and #sunshine/lollipops
  • "hashbang" - Creates "ajax crawlable" (deprecated by Google) hashes like #!/ and #!/sunshine/lollipops

Defaults to "slash".

children: node

A single child element to render.