Conditional display of component based on Route matching

I am looking to conditionally render a component based on the route (using React Router), and the component should return null if it matches any path pre-defined in an array or some sort of similar data structure, where I do not have to be reliant on a <Switch>/<Route> setup. Currently here is what I have but it is clearly inefficient and not robust at all.

const Component = (props) => {
    const path = props.location.pathname;

    const paths_to_hide = ["/path/to/something", "/path/to/A", "/path/to/B"];
    if (paths_to_hide.indexOf(path) != -1) return null;
    
    return (
        <div>test</div>
    );
}

For example, if I want to match the following paths:

  1. /path/to/something
  2. /path/to/something/<any path that follows after this>
  3. /path/<random string>/fixed
  4. /newPath/<random string>

Note that this list is not just limited to 4 items, which is why I’m trying to stray away from having inline <Route> matching as I’m looking for a more scalable approach which I can save in a config file and have imported as an array or some similar data structure.

Currently my implementation will only be able to identify the first item, and there is no way to match the subsequent items, using the indexOf() function. What would be the best way to accomplish this? Any help is appreciated, thank you!

182 thoughts on “Conditional display of component based on Route matching”

  1. [url=https://chpills.com/]generic accutane rx cost[/url] [url=https://ivermectinmt.com/]cost of ivermectin medicine[/url] [url=https://extratadalafil.com/]tadalafil tablets 20 mg price in india[/url] [url=https://viagraut.com/]sildenafil 25 mg buy[/url] [url=https://ntviagra.com/]sildenafil citrate tablets[/url] [url=https://buyepills.com/]augmentin prescription cost[/url] [url=https://gettadalafil.com/]tadalafil india online[/url] [url=https://tadalafileff.com/]tadalafil cost in india[/url] [url=https://buyviagramed.com/]viagra prescription cost canada[/url] [url=https://orderviagratabs.com/]where to get viagra in australia[/url]

    Reply
  2. [url=https://cialisecc.com/]cialis 1000 mg[/url] [url=https://hydroxychloroquinetb.com/]plaquenil 400 mg daily[/url] [url=https://ivermectinnew.com/]stromectol 3mg tablets[/url] [url=https://buyviagramed.com/]buy viagra paypal uk[/url] [url=https://cialisfv.com/]generic cialis us[/url] [url=https://prednisolonesale.com/]prednisolone sodium phosphate[/url] [url=https://tadalafileff.com/]tadalafil india brand[/url] [url=https://viagrapns.com/]where can i order real viagra[/url]

    Reply
  3. [url=http://modafinilxc.com/]buy modafinil singapore[/url] [url=http://chpills.com/]accutane otc drug[/url] [url=http://buyviagramed.com/]buy viagra online legitimate[/url] [url=http://pharmacyrite.com/]script pharmacy[/url]

    Reply
  4. [url=http://startpills.com/]lisinopril 10mg tablet[/url] [url=http://tadalafilxt.com/]tadalafil 20 mg mexico[/url] [url=http://viagrauni.com/]cheap viagra for sale[/url] [url=http://tadalafilworx.com/]best price tadalafil 20 mg[/url]

    Reply

Leave a Comment