diff --git a/examples/with-react-md/pages/index.js b/examples/with-react-md/pages/index.js index d1f8d3a2..d8757c81 100644 --- a/examples/with-react-md/pages/index.js +++ b/examples/with-react-md/pages/index.js @@ -1,6 +1,8 @@ import Head from 'next/head' import Link from 'next/link' +import { PureComponent } from 'react' + import Avatar from 'react-md/lib/Avatars' import Button from 'react-md/lib/Buttons/Button' import FontIcon from 'react-md/lib/FontIcons' @@ -28,17 +30,23 @@ const drawerHeaderChildren = [ /> ] -const NavigationLink = (props) => { - const { href, as, children, ..._props } = props - return ( -
- - - {children} - - -
- ) +class NavigationLink extends PureComponent { + // 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 ( +
+ + + {children} + + +
+ ) + } } export default () => {