1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/examples/active-class-name/components/Link.js

19 lines
537 B
JavaScript
Raw Normal View History

2017-10-31 07:58:00 +00:00
import { withRouter } from 'next/router'
import Link from 'next/link'
import React, { Children } from 'react'
const ActiveLink = ({ router, children, ...props }) => {
2017-10-31 07:58:00 +00:00
const child = Children.only(children)
2017-10-31 07:58:00 +00:00
let className = child.props.className || ''
if (router.pathname === props.href && props.activeClassName) {
2017-10-31 07:58:00 +00:00
className = `${className} ${props.activeClassName}`.trim()
}
2017-10-31 07:58:00 +00:00
delete props.activeClassName
2017-10-31 07:58:00 +00:00
return <Link {...props}>{React.cloneElement(child, { className })}</Link>
}
2017-10-31 07:58:00 +00:00
export default withRouter(ActiveLink)