terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity

examples/with-react-md: Fixed "Cannot read property 'focus' of undefined" (#961)

Browse source
This commit is contained in:
Vlad Frolov 2017-02-02 23:56:07 +02:00 committed by Tim Neutkens
parent 3e34430f74
commit fca0a39cbc
1 changed files with 19 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
examples/with-react-md/pages/index.js
View file

@ -1,6 +1,8 @@
import Head from 'next/head' import Head from 'next/head'
import Link from 'next/link' import Link from 'next/link'
import { PureComponent } from 'react'
import Avatar from 'react-md/lib/Avatars' import Avatar from 'react-md/lib/Avatars'
import Button from 'react-md/lib/Buttons/Button' import Button from 'react-md/lib/Buttons/Button'
import FontIcon from 'react-md/lib/FontIcons' import FontIcon from 'react-md/lib/FontIcons'
@ -28,17 +30,23 @@ const drawerHeaderChildren = [
/> />
] ]
const NavigationLink = (props) => { class NavigationLink extends PureComponent {
const { href, as, children, ..._props } = props // NOTE: Don't try using Stateless (function) component here. `ref` is
// required by React-MD/AccessibleFakeButton, but Stateless components
// don't have one by design:
// https://github.com/facebook/react/issues/4936
render () {
const { href, as, children, ..._props } = this.props
return ( return (
<div {..._props}> <div {..._props} style={{padding: 0}}>
<Link href={href} as={as}> <Link href={href} as={as}>
<a className='md-list-tile' style={{padding: 0, overflow: 'hidden'}}> <a className='md-list-tile md-list-tile--mini' style={{width: '100%', overflow: 'hidden'}}>
{children} {children}
</a> </a>
</Link> </Link>
</div> </div>
) )
}
} }
export default () => { export default () => {