HashRouter v6.26.2 (2024)

Table of Contents

basename future window

Type declaration

declare function HashRouter( props: HashRouterProps): React.ReactElement;interface HashRouterProps { basename?: string; children?: React.ReactNode; future?: FutureConfig; window?: Window;}

<HashRouter> is for use in web browsers when the URL should not (or cannot) be sent to the server for some reason. This may happen in some shared hosting scenarios where you do not have full control over the server. In these situations, <HashRouter> makes it possible to store the current location in the hash portion of the current URL, so it is never sent to the server.

import * as React from "react";import * as ReactDOM from "react-dom";import { HashRouter } from "react-router-dom";ReactDOM.render( <HashRouter> {/* The rest of your app goes here */} </HashRouter>, root);

`basename`

Configure your application to run underneath a specific basename in the URL:

function App() { return ( <HashRouter basename="/app"> <Routes> <Route path="/" /> {/* 👈 Renders at /#/app/ */} </Routes> </HashRouter> );}

`future`

An optional set of Future Flags to enable. We recommend opting into newly released future flags sooner rather than later to ease your eventual migration to v7.

function App() { return ( <HashRouter future={{ v7_startTransition: true }}> <Routes>{/*...*/}</Routes> </HashRouter> );}

`window`

HashRouter defaults to using the current document's defaultView, but it may also be used to track changes to another window's URL, in an <iframe>, for example.