I am making a login application when i am clicking the login button the i am reciving an error (loginPage.js:33 Uncaught (in promise) TypeError: setLoginUser is not a function) here is the code of app.js
function App() {
const [user,setLoginUser] = useState({})
return(
<div className='App'>
<BrowserRouter>
< Routes>
<Route path="/homepage" element={user && user?._id? <Homepage /> : <Login setLoginUser={setLoginUser} />}/>
<Route path="/login" element={<Login />} setLoginUser={setLoginUser}/>
<Route path="/register" element={<Register />} />
</Routes>
</BrowserRouter>
</div>
)
}
and here is the code of loginPage.js where error is occuring
const Login = ({ setLoginUser }) => {
const login = () => {
axios.post("http://localhost:4000/login", user)
.then(res => {
alert(res.data.message)
console.log(res.data.user)
setLoginUser(res.data.user)
navigate('/homepage')
})
}
}
You have to pass your setLoginUser
function to Login
component in your routes.
<Route path="/login" element={<Login setLoginUser={setLoginUser} />} />