react-router-hash-route
Enable hash / id based routes with react router.
Try out the example.
The HashRoute
component scrolls to the "wrapped" element after componentDidMount
or on route change when the hash / id matches.
Usage
Given the component Foo
(Your component MUST render the id prop):
const Foo = ({id}) => <div id={id}>Foo</div>
render
prop
<HashRoute id='foo' render= <Foo id=id /> />
component
prop
<HashRoute id='foo' component=Foo />
Options
offset
prop (number, default=0)
An optional vertical offset when using fixed headers.
scoll
prop (function, default="jump")
A customizable scroll function with the signature:
const scroll = node offset = {}
If you want to have animations etc.
Development
Start watching and building the lib:
$ npm i && npm run dev
Build and start the example website with hot-reloading:
$ npm run dev