Link activeClassName not working.

[Aurailus]

Hi, I'm trying to use ActiveClassName to style my links, but the property is not being processed, and is instead being passed down to the native DOM. Here's my code:

					<nav class="AppHeader-nav">
						<Link activeClassName="active" href="/admin/home">Home</Link>
						<Link activeClassName="active" href="/admin/pages">Pages</Link>
						<Link activeClassName="active" href="/admin/media">Media</Link>
						<Link activeClassName="active" href="/admin/themes">Themes</Link>
						<Link activeClassName="active" href="/admin/plugins">Plugins</Link>
					</nav>

And the resultant HTML:

<nav class="AppHeader-nav"><a activeclassname="active" href="/admin/home">Home</a><a activeclassname="active" href="/admin/pages">Pages</a><a activeclassname="active" href="/admin/media">Media</a><a activeclassname="active" href="/admin/themes">Themes</a><a activeclassname="active" href="/admin/plugins">Plugins</a></nav>

I as on /admin/home when I copied the above HTML. Please let me know if you need any more information.

[levidurfee]

Possibly related to #365 ?

[mariosant]

Any updates on that? I have the very same issue.

[sirianni]

Any updates? Same problem here.

[orangecoloured]

I see the same behaviour. Link from match does not have activeClassName applied when on href route.

[timiles]

As per this comment: https://github.com/preactjs/preact-router/issues/333#issuecomment-543839970, this is fixed for me if I use import { Link } from 'preact-router/match'; rather than import { Link } from 'preact-router'; (preact-router v3.2.1)

[orangecoloured]

The active class with Link from match doesn't work for SSR pages.

[qrhfz]

<Link> from preact-router/src/index.js should just reexport from preact-router/match/src/index.js

[teodragovic]

There is indeed bug with matching <Link> and activeClassName when className is present

import { Link } from 'preact-router/match';

<Link activeClassName="is-active" class="c-header-link" href="/foo">Foo</Link> // works

<Link activeClassName="is-active" className="c-header-link" href="/foo">Foo</Link> // does not work

Tested with [email protected] and [email protected]