CODEWITHSUNDEEP
javascriptreactjsecmascript-6react-router
Myth Vince
Myth Vince

Reputation: 143

react-router-dom passing useState for reusing other routes

So I can't see something react-hooks related here and I don't get the logic a little bit in react component with those passing state in routes.

So basically something like this.

      <Router>
        <Navbar></Navbar>
        <Routes>
          <Route path="/guest" element={<Guest></Guest>}></Route>
          <Route path="/saved" element={<SavedItem></SavedItem>}></Route>
          <Route path="/selectedgallery" element={<SelectedGallery></SelectedGallery>}></Route>
          <Route path="/selectedsavedgallery" element={<SelectedSaveGallery></SelectedSaveGallery>}></Route>
          <Route path="/login" element={<Login></Login>}></Route>
          <Route path="/register" element={<Register></Register>}></Route>
          <Route path="/" element={<Gallery></Gallery>}></Route>
          <Route path="/create" element={<CreatePin></CreatePin>}></Route>
        </Routes>
      </Router>

As you see I have <Login> and what I want to do I will pass my useState() in that area and when I get the user I will pass it in my other routes so I could reuse it for users that have login.

I imagine it somehow look like this

    const [owner,setOwner] = useState()
    
    ...
   <Route path="/login" element={<Login></Login>} {whatever here to pass the "setOwner" and "owner".} ></Route>
    ...

Yes,so I'm passing the props in any routes so that I could reuse it and then other routes can used it for their own purposes.

Upvotes: 0

Views: 989

Answers (1)

tobywong
tobywong

Reputation: 36

setOwner can be passed to the Login element as an parameter

<Route path="/login" element={<Login setOwner={setOwner}/>} />

in Login

function Login({setOwner}) {
  ...
  setOwner("foo");
  ...
}

Upvotes: 1

Related Questions