Home > Back-end >  React route not matching query string
React route not matching query string

Time:09-17

I want react route to match for localhost:8945/?type=admin adddress.I tried with following code but it is always rendering Home component.

<BrowserRouter>
          <Switch>
            <Route exact path = "/?type=admin">        **this is not working**
              <Admin />
            </Route>
            <Route exact path = "/">
              <Home/>
            </Route>
        </Switch>
</BrowserRouter>

Whenever I type localhost:8945/?type=admin in url bar it should render Admin component (Without requiring any server api).

CodePudding user response:

Hi, check this out Query Params

CodePudding user response:

got solution !

class App extends React.Component{
 constructor() {
    super();

    this.state = {
        type:''
    };
  }
componentDidMount() {
  this.setUrlParams();
}

setUrlParams(){
    const urlParams = new URLSearchParams(window.location.search);
    this.setState({type : urlParams.get('type')})
  }
 

 render(){
   return {
                <div>

               {  this.state.type=== 'admin'
                 ? <Admin/>
                 : <Home/>
               }
               </div>

     }
}
}
  • Related