Skip to content

Commit b709585

Browse files
committed
Add NavHashLink to readme
1 parent 7198cd9 commit b709585

File tree

1 file changed

+18
-1
lines changed

1 file changed

+18
-1
lines changed

README.md

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,31 @@ This is a solution to [React Router's issue of not scrolling to `#hash-fragments
99
When you click on a link created with `react-router-hash-link` it will scroll to the element on the page with the `id` that matches the `#hash-fragment` in the link. This will also work for elements that are created after an asynchronous data load. Note that you must use React Router's `BrowserRouter` for this to work.
1010

1111
```shell
12+
$ yarn add react-router-hash-link
13+
# OR
1214
$ npm install --save react-router-hash-link
1315
```
1416

17+
## `<HashLink>`
1518
```javascript
1619
// In YourComponent.js
1720
...
1821
import { HashLink as Link } from 'react-router-hash-link';
1922
...
20-
// Use it just like a RRv4 link (to can be a string or an object, see RRv4 api for details):
23+
// Use it just like a RRv4 <Link> (to can be a string or an object, see RRv4 api for details):
2124
<Link to="/some/path#with-hash-fragment">Link to Hash Fragment</Link>
2225
```
26+
27+
28+
## `<NavHashLink>`
29+
```javascript
30+
// In YourComponent.js
31+
...
32+
import { NavHashLink as NavLink } from 'react-router-hash-link';
33+
...
34+
// Use it just like a RRv4 <NavLink> (see RRv4 api for details):
35+
<NavLink
36+
to="/some/path#with-hash-fragment"
37+
activeClassName="selected"
38+
>Link to Hash Fragment</NavLink>
39+
```

0 commit comments

Comments
 (0)