Force nagivate functon in Gatsby to redirect only with in site

Viewed 70

How to restrict navigate function in Gatsby to redirect only client routing URLs, not to external site.

1 Answers

Gatsby navigation extends from @reach/router (from React) and it's intended to use only with internal navigation so by default, their use it's restricted only to the internal routes of the project.

As you can see in Gatsby's docs:

For internal navigation, Gatsby includes a built-in <Link> component for creating links between internal pages as well as a navigate function for programmatic navigation.

The component is a wrapper around @reach/router’s Link component that adds useful enhancements specific to Gatsby. All props are passed through to @reach/router’s Link component.

For external links, you always will need to use the "traditional" anchor (<a>). On the other hand, Gatsby's navigation is strictly restricted for internal routing.

Related