routersolid-js

How to prevent SolidJS router from interpreting regular links?

I have a classic web page with regular <a href="..."> tags. In this page, I integrated a SolidJS application, with the HashRouter (using #):

<a href="/page1">Page 1</a>
<a href="/page2">Page 2</a>
<div id="solid-js-main"></div>

When I click on a link outside the application, the SolidJS router overwrites the link behavior, and the link target is not loaded. Instead, it tries opening the link in the SolidJS application.

For example, if I click on the "Page 1" link: instead of loading /page1, it opens #/page1.

How to disable this feature?

Solution

  • I just found the solution:

    <HashRouter explicitLinks={true}>

    Documentation: https://github.com/solidjs/solid-router?tab=readme-ov-file#router

    explicitLinks: Disables all anchors being intercepted and instead requires <A>. default: false