Why Navigate to a route not working in react?-CodePudding

I have a react application wherein users can access the homepage only after they are signedUp/ loggedIn. I have checked for user object provided by firebase upon authentication in the Homepage ,and if it is undefined I have used Navigate to redirect user back to signup.

Code for the same:

import React, {useEffect,useState} from 'react'
import {Link,useNavigate,Navigate} from 'react-router-dom';
import profile from './t1.webp'




var usernm="";
 const Homepage = ({user,username,setusername}) => {
     
    if(user=={} || !user)
    {
        console.log(!user);
    <Navigate to="/signup"></Navigate>
    console.log("sycsd")
    }
  
    return (
        <>
            <header>
               //code for homepage
            </header>
        </>
    )
}

export default Homepage

My console.log:


Homepage.js:29 true
Homepage.js:31 sycsd

apparently both console.logs are working still its not navigated to signup.

CodePudding user response：

You need to do it like this

Const nav=useNavigate()
if(user=={} || !user)
 {
nav("/signup");
  }