1

I am making a simple chat-app. Users submit a form with name and room, and are sent to the room, with the username. The problem is, I cannot figure out how to pass the username through via the Link. This is the relevant code:

<Link to={{ pathname: `/${room}`, state: { the: user } }}>
  Enter room
</Link>

I use simple useState hooks to set room and username from input. From what I have read, this way of doing it is deprecated, and I cannot find a proper answer for react-router-dom@5, only 4 and below.

Also, I have no idea how I am supposed to intercept this data. This is my App.js code:

return (
  <Router>
    <div className='app' >
      <Switch>
        <Route exact path='/'>
          <Menu />
        </Route>
        <Route exact path='/:room'>
          <ChatApp />
        </Route>
      </Switch>
    </div>
  </Router>
);

So as you can see, the link sends you to the ChatApp component. To make it as simple as possible, the top of that looks like this:

const ChatApp = (props) => {

but when I console.log(props), all I get is an empty array. Does anyone know a reliable way of passing and intercepting data via links? Perhaps it should be done a different way?

Drew Reese
  • 165,259
  • 14
  • 153
  • 181
Sergio
  • 41
  • 8

1 Answers1

0

Not necessarily the right answer, but the way things look, in rrd@5, you cannot, and you are forced to send the props as params. Not sure for objects though

Sergio
  • 41
  • 8