Anish Neupane
Error while using useNavigate() or <Navigate />
PrivateRoute.tsx
import { Route, useNavigate } from '@solidjs/router'
import Index from '../pages'
const PrivateRoute = () => {
const isLoggedIn = !!localStorage.getItem('token')
const navigate = useNavigate()
if (!isLoggedIn) {
navigate('/', { replace: true })
}
return <Route path='/' component={Index} />
}
export default PrivateRoute
App.tsx
import { MetaProvider } from '@solidjs/meta'
import { Route, Router } from '@solidjs/router'
import { Component, lazy } from 'solid-js'
import PrivateRoute from './routes'
const Login = lazy(() => import('./pages/Login'))
const App: Component = () => {
return (
<MetaProvider>
<Router>
<Route children={<PrivateRoute />} />
<Route path='/login' component={Login} />
</Router>
</MetaProvider>
)
}
export default App
The error in browser is Uncaught Error: Make sure your app is wrapped in a <Router />
Any Solution28 replies