React Router Quick Start Guide

location prop

The isActive function in <NavLink> receives the browser's history location and determines whether the browser's location.pathname matches the given condition. To provide a different location, include the location prop:

<NavLink    to="/user"    activeStyle={{        background: 'red',        color: 'white'    }}    location={{        search: '?id=2',    }}    isActive={(match, location) => {        if (!match) {            return false;        }        const searchParams = new URLSearchParams(location.search);        return match.isExact && searchParams.has('id');    }}>    User</NavLink>

Notice that the to prop doesn't specify the search parameter; however, the location prop includes it, and thus, when the browser's location is /user, the isActive function returns true, since the search parameter includes ...