Rajesh Joshi
Solidjs navbar and router setup problem
Can anyone help, my Index.jsx is as under:
import { render } from "solid-js/web";
import { Router } from "@solidjs/router";
import "./index.css";
import App from "./App";
const root = document.getElementById("root");
render(
() =>
<Router root={App} />,
root
);
App.js is as under:
import { Route, Router } from "@solidjs/router";
import Nav from "./Components/Nav.jsx";
import Home from "./Pages/Home";
import SavedRepos from "./Pages/SavedRepos.jsx";
function App () {
return (
<div class="container">
<Nav />
<Route>
<Route path="/" component={ Home } />
<Route path="/savedrepos" component = { SavedRepos } />
</Route>
{/* <h1>App Component</h1> */}
</div>
);
}
export default App;
Nav.jsx is as under:
import { A } from "@solidjs/router";
const Nav = () => {
return (
<nav class="mt-5 mb-3">
<A href="/" class="btn btn-primary me-2" end activeClass="btn-success" > Home </A> <A href="/savedrepos" class="btn btn-primary me-2" activeClass="btn-success" > Saved Repos </A> </nav> ); }; export default Nav; The above code is not working, it shows navbar items only when "/" but when click "/seavedrepos" all blank even when "/" it does not show screen for Home just show navbar items.
<A href="/" class="btn btn-primary me-2" end activeClass="btn-success" > Home </A> <A href="/savedrepos" class="btn btn-primary me-2" activeClass="btn-success" > Saved Repos </A> </nav> ); }; export default Nav; The above code is not working, it shows navbar items only when "/" but when click "/seavedrepos" all blank even when "/" it does not show screen for Home just show navbar items.
4 replies
SolidJS Router problem
I am really fed up with setting up the navbar for my test app. Can someone help me to setup Router for my two links say (Home, Link1) in navigation bar. How to set up {Router} and {Route} tags? like I have main <App.jsx> file, then <Nav.jsx> in Component folder, <Home.jsx>, <Link1.jsx> in Pages folder.
what should I declare in <index.jsx> and what should with <App.jsx> files. The related tutorial is very confusing, there is no mention about, in which file we should set up the <Router> and <Route> tags.
thanks in advance.
3 replies