const MenuItem = ({ to, title, icon, seletedPaths }) => { const { pathname } = useLocation(); const selected = (seletedPaths || [to]).some(path => matchPath(pathname, {path: path, exact: true})) return ( <ListItem button to={to} component={Link} selected={selected}> <ListItemIcon> {icon} </ListItemIcon> <ListItemText primary={title} /> </ListItem> ) }
function App({ children, location }) { const match = matchPath(location.pathname, { path: "/stories/:storyId", exact: true,
const match = matchPath(request.url, typeof route.path === 'function' ? route.path() : route.path, route)
const [{ auth }] = useStore(); const hideUserSuggestions = matchPath(pathname, { path: [Routes.MESSAGES, Routes.PEOPLE, Routes.EXPLORE, Routes.USER_PROFILE], });
const matchRoutes = (routesArr, location, storeArg) => Promise.all( components(routesArr) .filter(({ props }) => matchPath(location, props)) .map(pre => pre.props) .filter(props => props.component.preRender) .map(props => props.component.preRender(storeArg, location)) )
/** * Finds the matching route from a given pathname: * * Ex: getRoute("/top/agility") -> "/top/:metric?/:playerType?" */ export function getRoute(pathname) { const route = ROUTES.find(({ path }) => { const match = matchPath(pathname, path); return match ? match.isExact : false; }); return route ? route.path : null; }
function prefetchData( url, dispatch ) { const promises = routes .map( ( route ) => ( { route, match: matchPath( url, route ) } ) ) .filter( ( { route, match } ) => match && route.component.prefetch ) .map( ( { route, match } ) => dispatch( route.component.prefetch( match ) ) ); return Promise.all( promises ); }
const isActive = (path, history) => { return matchPath(path, { path: history.location.pathname, exact: true, strict: false }) }
routes.map(route=>{ var match = matchPath(url,route); if(match) return [route.component,match]; }).filter(val=>{ return !!val; })
// Gets the matched URL and removes any optional segments at the end. function getUrlWithoutParams (url = '', path = '', props, includeRequired) { const pattern = new RegExp( includeRequired ? /(\/:[^/?*]+[?*])*$/ : /(\/:[^/?*]+)*$/, props.sensitive ? '' : 'i' ), // Match all optional parameters at the end of the path. modifiedPath = path.replace(pattern, ''), modifiedMatch = matchPath(url, {...props, path: modifiedPath}); return modifiedMatch ? modifiedMatch.url : url; }
const Menu = props => { const location = useLocation(); const { url } = useRouteMatch(); const routes = [ { name: 'Home', route: `${url}/home` }, { name: 'List', route: `${url}/list` }, { name: 'Add', route: `${url}/edit/0` } ]; return <React.Fragment> <div className='nav-scroller bg-white box-shadow'> <nav className='nav nav-underline'> {routes.map((r, i) => <Link key={i} className={!!matchPath(location.pathname, r.route) ? 'nav-link active' : 'nav-link'} to={r.route}>{r.name}</Link>)} </nav> </div> </React.Fragment>; }
getServiceID() { const { params: { id } } = matchPath(this.props.match.url, { path: '/services/:id' }); return id; }
export function getMatch(map, pathname, execute) { const result = Object.entries(map).find(([route]) => matchPath(pathname, route)); return result && result[1]; }
const Route = ({ component: Element, path, activePath, ...props }) => { const match = matchPath(activePath, { path, ...props, }); return match ? <Element match={match} /> : null; }
const match = matchPath(request.url, typeof route.path === 'function' ? route.path() : route.path, route)