mirror of
https://github.com/Dvorinka/Devour.git
synced 2026-06-03 20:13:03 +00:00
Tomas Dvorak
17 lines
3.6 KiB
JSON
17 lines
3.6 KiB
JSON
{
|
|
"id": "44261e9239a6673df0c46923",
|
|
"source": "solid:signals",
|
|
"type": "github-document",
|
|
"title": "hash-router",
|
|
"content": "---\ntitle: HashRouter\nuse_cases: \u003e-\n static file hosting, single html file apps, no server routing, github pages,\n static deployment\ntags:\n - hash-routing\n - static-hosting\n - client-side\n - spa\n - deployment\n - component\nversion: '1.0'\ndescription: \u003e-\n HashRouter enables client-side routing using URL hash values, perfect for\n static file hosting where server-side routing isn't available.\n---\n\nThe `HashRouter` is a top level component that manages the routing of your application.\nIt is a client side router that uses hash-values in the URL - providing a single-page application a way to replicate the experience of a multi-page application.\n\nSince hash-routing provides a way for an application to run from a single HTML file, it can be used when hosting on a static file server.\n\nCompared to a browser-router, such as [`Router`](/solid-router/reference/components/router), is that this approach is not SEO friendly.\nBecause most search engines do not index the hash portion of a URL, they are only able to see the index page of your application when using this approach.\n\nThe `root` property is used for components that wrap a matched route and require access to the router context, relevant with navigation components that use [`\u003cA\u003e`](/solid-router/reference/components/a) links.\n\n```tsx\nimport { render } from \"solid-js/web\";\nimport { HashRouter, Route } from \"@solidjs/router\";\n\nconst App = (props) =\u003e (\n\t\u003c\u003e\n\t\t\u003ch1\u003eRoot header\u003c/h1\u003e\n\t\t{props.children}\n\t\u003c/\u003e\n);\n\nrender(\n\t() =\u003e \u003cHashRouter root={App}\u003e{/*... routes */}\u003c/HashRouter\u003e,\n\tdocument.getElementById(\"app\")\n);\n```\n\n| prop | type | description |\n| ------------- | -------------------------------------------------------- | ----------------------------------------------------------------------------------- |\n| children | `JSX.Element`, `RouteDefinition`, or `RouteDefinition[]` | The route definitions |\n| root | Component | Top level layout component |\n| base | string | Base url to use for matching routes |\n| actionBase | string | Root url for server actions, default: `/_server` |\n| preload | boolean | Enables/disables preloads globally, default: `true` |\n| explicitLinks | boolean | Disables all anchors being intercepted and instead requires [`\u003cA\u003e`](/solid-router/reference/components/a). default: `false` |",
|
|
"url": "https://github.com/solidjs/solid-docs/blob/HEAD/src/routes/solid-router/reference/components/hash-router.mdx",
|
|
"metadata": {
|
|
"path": "src/routes/solid-router/reference/components/hash-router.mdx",
|
|
"repo": "solidjs/solid-docs",
|
|
"repo_url": "https://github.com/solidjs/solid-docs.git",
|
|
"size": 2932,
|
|
"source_type": "github"
|
|
},
|
|
"hash": "b14df7add47d118bd13a62f3216b696a2f5f880ff0e9452abe3024277a8c2f82",
|
|
"timestamp": "2026-02-23T11:43:00.192386057+01:00"
|
|
} |