Re-render issue
Opened this issue · 0 comments
el-fuego commented
https://github.com/dlmr/react-router-redial/blob/master/src/RedialContainer.js#L28
Every time, container generate new abort and reload functions instances, so can`t skip re-render by using PureComponents.
For some reason, can`t fork a repo, so will paste code here:
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import getRoutePath from './util/getRoutePath';
export default class RedialContainer extends Component {
static displayName = 'RedialContainer';
static propTypes = {
children: PropTypes.element.isRequired,
routerProps: PropTypes.object.isRequired,
};
static contextTypes = {
redialContext: PropTypes.object.isRequired,
};
reload = () => {
this.context.redialContext.reloadComponent(this.props.routerProps.route.component);
}
render() {
const { routerProps, ...props } = this.props;
const {
abortLoading,
loading,
afterTransitionLoading,
redialMap,
} = this.context.redialContext;
const mapKey = getRoutePath(routerProps.route, routerProps.routes, routerProps.key);
const redialProps = redialMap.get(mapKey);
return React.cloneElement(
this.props.children,
{
...props,
...redialProps,
...routerProps,
loading,
afterTransitionLoading,
reload: this.reload,
abort: abortLoading,
}
);
}
}