diff --git a/.gitignore b/.gitignore index 3daf837..7422316 100644 --- a/.gitignore +++ b/.gitignore @@ -5,3 +5,5 @@ node_modules amd lib tmp-bower-repo +.idea +package-lock.json diff --git a/src/IndexLinkContainer.js b/src/IndexLinkContainer.js index 33e5498..6a044f1 100644 --- a/src/IndexLinkContainer.js +++ b/src/IndexLinkContainer.js @@ -1,10 +1,11 @@ import React from 'react'; +import { withRouter } from 'react-router-dom'; import LinkContainer from './LinkContainer'; // Don't use a stateless function, to allow users to set a ref. /* eslint-disable react/prefer-stateless-function */ -export default class IndexLinkContainer extends React.Component { +export class IndexLinkContainer extends React.Component { render() { return ( @@ -12,3 +13,5 @@ export default class IndexLinkContainer extends React.Component { } } /* eslint-enable react/prefer-stateless-function */ + +export default withRouter(IndexLinkContainer); diff --git a/src/LinkContainer.js b/src/LinkContainer.js index 2ddf568..dbbc535 100644 --- a/src/LinkContainer.js +++ b/src/LinkContainer.js @@ -1,22 +1,20 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { Route } from 'react-router-dom'; +import { Route, withRouter } from 'react-router-dom'; const isModifiedEvent = (event) => !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey); -export default class LinkContainer extends Component { - static contextTypes = { - router: PropTypes.shape({ - history: PropTypes.shape({ - push: PropTypes.func.isRequired, - replace: PropTypes.func.isRequired, - createHref: PropTypes.func.isRequired, - }).isRequired, - }).isRequired, - }; - +export class LinkContainer extends Component { static propTypes = { + history: PropTypes.shape({ + push: PropTypes.func.isRequired, + replace: PropTypes.func.isRequired, + createHref: PropTypes.func.isRequired, + }).isRequired, + location: PropTypes.object, + match: PropTypes.object, + staticContext: PropTypes.object, children: PropTypes.element.isRequired, onClick: PropTypes.func, replace: PropTypes.bool, @@ -58,8 +56,7 @@ export default class LinkContainer extends Component { ) { event.preventDefault(); - const { history } = this.context.router; - const { replace, to } = this.props; + const { replace, to, history } = this.props; if (replace) { history.replace(to); @@ -67,12 +64,16 @@ export default class LinkContainer extends Component { history.push(to); } } - } + }; render() { const { + history, + location: _location, // eslint-disable-line no-unused-vars + match: _match, // eslint-disable-line no-unused-vars + staticContext: _staticContext, // eslint-disable-line no-unused-vars children, - replace, // eslint-disable-line no-unused-vars + replace, // eslint-disable-line no-unused-vars to, exact, strict, @@ -84,7 +85,7 @@ export default class LinkContainer extends Component { ...props, } = this.props; - const href = this.context.router.history.createHref( + const href = history.createHref( typeof to === 'string' ? { pathname: to } : to ); @@ -114,3 +115,5 @@ export default class LinkContainer extends Component { ); } } + +export default withRouter(LinkContainer); diff --git a/test/LinkContainer.spec.js b/test/LinkContainer.spec.js index f616b59..5e85c9f 100644 --- a/test/LinkContainer.spec.js +++ b/test/LinkContainer.spec.js @@ -4,7 +4,7 @@ import * as ReactBootstrap from 'react-bootstrap'; import { findDOMNode } from 'react-dom'; import { Route, MemoryRouter as Router } from 'react-router-dom'; -import LinkContainer from '../src/LinkContainer'; +import LinkContainer, { LinkContainer as RawLinkContainer } from '../src/LinkContainer'; describe('LinkContainer', () => { [ @@ -62,7 +62,7 @@ describe('LinkContainer', () => { ); const container = ReactTestUtils.findRenderedComponentWithType( - router, LinkContainer + router, RawLinkContainer ); const component = ReactTestUtils.findRenderedComponentWithType( router, Component