search

rafgraph / react-router-hash-link

Hash link scroll functionality for React Router
https://react-router-hash-link.rafgraph.dev
MIT License
732 stars 62 forks source link

Possible improvement to Documentation #57

Closed DiagoSmith closed 3 years ago

DiagoSmith commented 4 years ago

Hey, Firstly thanks for this library, it's very handy!

However it would be nice if the documentation maybe stated the full implementation including how the target element should look like. It took me a little while of searching to realize that you have to append the name of the fragment as an id, as although mentioned, it's fairly hidden in the docs without any code examples. I was trying in vain for a while to use href on a standard anchor element.

Thanks!

jeanlambert17 commented 4 years ago

I would really like to improve the custom link section, I don't undestand how can I implement my custom link (or button) with the actual example.

rafgraph commented 4 years ago

Unless a library requires you to use their Link component, then you don't need to create a custom link (majority of use cases don't need it). If you do need to use a specific Link component (e.g. Gatsby), then just pass it into the function as shown: const MyCustomLink = props => genericHashLink(props, SpecificLibraryLink);

Also, the hash link scroll functionality is essentially intended to mimic native browser behavior - it's a fix specific to React Router - where the hash in the url scrolls to the element with a matching id. See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a