BaseLink activePropName prop Boolean value causes a warning in React 16

The activePropName prop on the BaseLink component causes a warning in React 16 due to being assigned a Boolean value.

For example, this component:

<Link to='/' activePropName='active'>

will produce this warning:

Warning: Received `true` for a non-boolean attribute `active`.

If you want to write it to the DOM, pass a string instead: active="true" or active={value.toString()}.

As the warning message suggests, this can be solved by changing the prop value from a Boolean to a String.

Note: this can also be solved without a change to the codebase by using a data attribute:

<Link to='/' activePropName='data-active'>

[taion]

Yeah, I mean, it’s the sort of thing that should probably take functional children like:

<Link to="/">
  {active => <NavItem active={active}>Whatever</NavItem>}
</Link>

But activePropName is less typing, and this is a fairly common pattern anyway.

[lukehedger]

Ah ok, I see - so you would always use activePropName with the Component prop and a custom anchor.

This makes complete sense - thanks for clarifying!