From 16044d7e8e39bce0d9a22db0dd2f1d35fce41fbf Mon Sep 17 00:00:00 2001 From: Gustavo de Paula Date: Tue, 17 Jul 2018 20:53:54 -0300 Subject: [PATCH 1/4] refac: removing unsafe lifecycles --- packages/react-router/modules/Router.js | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/packages/react-router/modules/Router.js b/packages/react-router/modules/Router.js index a68b44d883..4b5c355b3a 100644 --- a/packages/react-router/modules/Router.js +++ b/packages/react-router/modules/Router.js @@ -33,10 +33,6 @@ class Router extends React.Component { }; } - state = { - match: this.computeMatch(this.props.history.location.pathname) - }; - computeMatch(pathname) { return { path: "/", @@ -46,8 +42,9 @@ class Router extends React.Component { }; } - componentWillMount() { - const { children, history } = this.props; + constructor(props) { + super(props); + const { children, history } = props; invariant( children == null || React.Children.count(children) === 1, @@ -62,13 +59,18 @@ class Router extends React.Component { match: this.computeMatch(history.location.pathname) }); }); + + this.state = { + match: this.computeMatch(this.props.history.location.pathname) + }; } - componentWillReceiveProps(nextProps) { + shouldComponentUpdate(nextProps) { warning( this.props.history === nextProps.history, "You cannot change " ); + return true; } componentWillUnmount() { From a572d94aa530c5aa39cc1e61293703c7458edd99 Mon Sep 17 00:00:00 2001 From: Gustavo de Paula Date: Tue, 17 Jul 2018 21:25:28 -0300 Subject: [PATCH 2/4] refac: extracting state from constructor --- packages/react-router/modules/Router.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/react-router/modules/Router.js b/packages/react-router/modules/Router.js index 4b5c355b3a..4e33b74df1 100644 --- a/packages/react-router/modules/Router.js +++ b/packages/react-router/modules/Router.js @@ -33,6 +33,10 @@ class Router extends React.Component { }; } + state = { + match: this.computeMatch(this.props.history.location.pathname) + }; + computeMatch(pathname) { return { path: "/", @@ -59,10 +63,6 @@ class Router extends React.Component { match: this.computeMatch(history.location.pathname) }); }); - - this.state = { - match: this.computeMatch(this.props.history.location.pathname) - }; } shouldComponentUpdate(nextProps) { From 98195cbedd37e447c4e4144e7ddcdc21e7ba5790 Mon Sep 17 00:00:00 2001 From: Gustavo de Paula Date: Sun, 5 Aug 2018 14:12:47 -0300 Subject: [PATCH 3/4] refac: requested changes --- packages/react-router/modules/Router.js | 20 +++++++++++++------- 1 file changed, 13 insertions(+), 7 deletions(-) diff --git a/packages/react-router/modules/Router.js b/packages/react-router/modules/Router.js index 4e33b74df1..58c5bb1f20 100644 --- a/packages/react-router/modules/Router.js +++ b/packages/react-router/modules/Router.js @@ -20,6 +20,17 @@ class Router extends React.Component { router: PropTypes.object.isRequired }; + static getDerivedStateFromProps(nextProps) { + const { children } = nextProps; + + invariant( + children == null || React.Children.count(children) === 1, + "A may have only one child element" + ); + + return null; + } + getChildContext() { return { router: { @@ -50,11 +61,6 @@ class Router extends React.Component { super(props); const { children, history } = props; - invariant( - children == null || React.Children.count(children) === 1, - "A may have only one child element" - ); - // Do this here so we can setState when a changes the // location in componentWillMount. This happens e.g. when doing // server rendering using a . @@ -65,9 +71,9 @@ class Router extends React.Component { }); } - shouldComponentUpdate(nextProps) { + componentDidUpdate(prevProps) { warning( - this.props.history === nextProps.history, + this.props.history === prevProps.history, "You cannot change " ); return true; From 3d149d3127a0265b07fd625ade0bc2c63ab1d45a Mon Sep 17 00:00:00 2001 From: Tim Dorr Date: Sun, 5 Aug 2018 13:40:29 -0400 Subject: [PATCH 4/4] No need to return true. --- packages/react-router/modules/Router.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-router/modules/Router.js b/packages/react-router/modules/Router.js index 58c5bb1f20..ab025d8070 100644 --- a/packages/react-router/modules/Router.js +++ b/packages/react-router/modules/Router.js @@ -76,7 +76,6 @@ class Router extends React.Component { this.props.history === prevProps.history, "You cannot change " ); - return true; } componentWillUnmount() {