反应：如何使用componentDidUpdate更新location.pathname？

Question

一个组件为我的应用程序注册后，我会利用history.push('/login')。

但是，在地址栏中的URL发生更改的情况下却出现了这种现象，但是我没有看到新的组件。因此，我阅读了有关componentDidUpdate的文档，并指出：

componentDidUpdate（）在更新发生后立即被调用。 初始渲染不会调用此方法。

以此为契机在组件上操作DOM 已更新。

我认为开头应该是这样的

 componentDidUpdate(prevProps, nextProps) {
   if (this.props.location.pathname !== nextProps.props.location.pathname){
    this.props.location.pathname
    /* or some other black magic here */
   }
  }

但是后来我记得你不应该直接改变道具... 我该怎么办？

更新 根据苏尼尔（Sunil）的说法，我可能会在最高级别使用HOC

因为我最初使用的是Next.js，所以他们使用了页面导航，因此我正在这样做：

文件夹结构：

然后将HOC封装在我的客户端组件周围：

import 'semantic-ui-css/semantic.min.css'
import RegisterForm from '../components/Register/RegisterForm.jsx'
import '../components/Register/Register.css'
import { withRouter } from "react-router-dom";

const Register = (props) => (<>
 <RegisterForm {...props} />
</>)

export default withRouter(Register)