Matches return false from Match Tag on SSR (Meaningful 1st Pain)

[Louis]

hi, I got some issues about matches function when in server. I check my server(Meaningful 1st Pain) with turn off my javascript. Mathces return false.

 <Match path='/someurl'>
          {({ mathces,url }) => {
          console.log(matches) //false
          console.log(url) //nothing
            return matches &&(<Navbar/>);
          }}
        </Match>

i try to solve it with send url from my server.js and i set it into unistore

 const initialState = { url:req.url  }
 const store = createStore(initialState);
 let state = store.getState();
 let html = render(
          <Provider store={store}>
            <App url={state.url} />
          </Provider>
        );

so i send props url into my , and use some condition with

 <Match>
  {({ url }) => {
    if (url === `/someurl ||this.props.url === `/someurl`) return (<Navbar/> );
   }}
 </Match>

I'm not sure this better way to do. can i do it just with matches??

[Marvin Hagemeister]

The server doesn't have any concept of browser history. To ensure a correctly rendered output via SSR you need to pass in the initial URL into the router once. This is done by setting the url prop of the surrounding Router component. By doing so you don't need to introduce any additional conditions for each Match component and can leave them as-is.

<Router url="/my/initial/url">
  ...
</Router>

[Louis]

Okay thank you @marvinhagemeister .
My component

<div>
<matches>
 {(url)=>
 <navbar url={url||this.props.url}/>
 }
</matches>
<matches>
 {(url)=>
 <router url={url||this.props.url}/>
 }
</matches>
<matches>
 {(url)=>
 <footer url={url||this.props.url}/>
 }
</matches>
</div>

why i need this, when i do page reload : url = null, this.props.url=/someurl .
when de different thing is when i click <a href="/anotherurl/> : url=/anotherurl, this.props.url
this works, but i diunno this best practice or not. Im not use matches becase will return false when reload.