this is app.js

                  
import Header from './components/Header/Header';
import Login from './components/Login/Login';
import { BrowserRouter as Router, Route,Routes } from "react-router-dom";
import Register from './components/Register/Register';
import About from './components/About/About';
import Update from './components/Update/Update';
import Contact from './components/Contact/Contact';
import Home from './components/Home/Home';
import Logout from './components/Logout/Logout';
import Project from './components/Project/Project';
import Error from './components/Error';
import { useDispatch,useSelector } from 'react-redux';
import { useEffect } from 'react';
import { loadUser } from './actions/userActions';

function App() {

  const dispatch = useDispatch();
  const {loading, user} = useSelector((state) => state.user);

  useEffect(() => {
    dispatch(loadUser());
  }, [dispatch]);

  return (
    <div className="App">

     
     
     <Router>
     <Header />
      <Routes>
        <Route exact path="/" element={<Home
         userhome = {user} />} />
        <Route exact path="/login"  element={<Login />} />
        <Route exact path="/signup" element={<Register />} />
        <Route exact path="/about" element={<About /> } />
        <Route exact path="/update" element={<Update /> } />
        <Route exact path="/contact" element={<Contact /> } />
        <Route exact path="/logout" element={<Logout /> } />
        <Route exact path="/project" element={<Project /> } />
        <Route exact path="/profile" element={<About /> } />
        <Route path="*" element={<Error />} />
      </Routes>
      </Router>
     
    </div>
  );
}

export default App;

this is home.js in any react app, "localhost:3000" will automatically get rendered (if there is no error). In my case also same thing is happening, when the react app loads for the first time, it does not give any error. The output for first time is Name : Prajwal Raj

But as soon as i load the same home route for second time is gives error , Cannot read properties of undefined (reading 'name')

const Home =  ({userhome})  =>{
    return (
        <div className="home">
        <h1>HOME</h1>
        <p>Name : {userhome.name}</p>
        </div>
    );
};

export default Home;