"react-router": "^4.1.1",
"react-router-dom": "^4.1.1"
{jsonData.map(tag => (
<NavLink
key={tag.tagId}
to={`/tags/${tag.tagId}${search}`}
isActive={(match, location) => location.pathname + location.search === `/tags/${tag.tagId}${search}`}
className="tag-link"
>
{tag.tagName}
</NavLink>
))}
Why query string doesn't taken into account, at default active class calculation? Is it default behaviour? I should provide the same isActive function every time I want to highlight it
v4 doesn't process query strings at all. This is left up to you so you can choose the library that best matches the semantics you want. It also reduces tons of complexity and opinions in the library, making it more flexible for you to use. It's more work, but it's for the best for everyone.
But if you need to match the search string often, you can simply wrap NavLink in your own component to avoid the same boilerplate everywhere.