Use withRouter for TabsBar (#6652)
TabsBar refers to router, which is a private context property of react-router. withRouter is a recommended alternative. It also allows to track location changes even if React.PureComponent is used.
This commit is contained in:
parent
78d772af86
commit
61e6275781
1 changed files with 5 additions and 7 deletions
|
@ -1,6 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { NavLink } from 'react-router-dom';
|
import { NavLink, withRouter } from 'react-router-dom';
|
||||||
import { FormattedMessage, injectIntl } from 'react-intl';
|
import { FormattedMessage, injectIntl } from 'react-intl';
|
||||||
import { debounce } from 'lodash';
|
import { debounce } from 'lodash';
|
||||||
import { isUserTouching } from '../../../is_mobile';
|
import { isUserTouching } from '../../../is_mobile';
|
||||||
|
@ -24,14 +24,12 @@ export function getLink (index) {
|
||||||
}
|
}
|
||||||
|
|
||||||
@injectIntl
|
@injectIntl
|
||||||
export default class TabsBar extends React.Component {
|
@withRouter
|
||||||
|
export default class TabsBar extends React.PureComponent {
|
||||||
static contextTypes = {
|
|
||||||
router: PropTypes.object.isRequired,
|
|
||||||
}
|
|
||||||
|
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
intl: PropTypes.object.isRequired,
|
intl: PropTypes.object.isRequired,
|
||||||
|
history: PropTypes.object.isRequired,
|
||||||
}
|
}
|
||||||
|
|
||||||
setRef = ref => {
|
setRef = ref => {
|
||||||
|
@ -59,7 +57,7 @@ export default class TabsBar extends React.Component {
|
||||||
|
|
||||||
const listener = debounce(() => {
|
const listener = debounce(() => {
|
||||||
nextTab.removeEventListener('transitionend', listener);
|
nextTab.removeEventListener('transitionend', listener);
|
||||||
this.context.router.history.push(to);
|
this.props.history.push(to);
|
||||||
}, 50);
|
}, 50);
|
||||||
|
|
||||||
nextTab.addEventListener('transitionend', listener);
|
nextTab.addEventListener('transitionend', listener);
|
||||||
|
|
Loading…
Reference in a new issue