Reactjs 如何使用react router和ES6类模拟window.location

我使用的是react路由器，所以我在整个应用程序中使用

组件作为链接，在某些情况下，我需要根据用户输入动态生成链接，因此我需要类似

window.location

的内容，但不需要页面刷新

我找到了这张小纸条-（）-我尝试使用

this.context.router.transitiono（mylink）

，但是我在使用context时遇到了问题

这让我想到了（），但是上下文返回并为空对象，所以当我尝试这样做时：

this.context.router.transitiono（mylink）我获取
无法读取未定义的属性“transitiono”（如果我尝试在构造函数中设置this.context=context之类的操作）

我不想拖拖拉拉，但我也厌倦了过多地搅乱上下文，因为它是故意未记录的，因为它仍然是一项正在进行的工作，所以我已经读过了

有没有人遇到过类似的问题
 查看react路由器的
导航
混入

从文档中：

var-Navigation=require（'react-router'）。导航；
React.createClass({
mixins:[导航]，
render:function（）{
返回(
this.transitiono（'foo'）}>转到foo
this.replaceWith（'bar'）}>在不创建新历史记录条目的情况下转到bar
this.goBack（）}>返回
);
}
});
在这里找到了解决方案：，在这里：

建造师需要：

class SidebarFilter extends React.Component {

    constructor(props, context) {
        super(props, context);

还需要添加一个静态属性：

SidebarFilter.contextTypes = {
  router: React.PropTypes.func.isRequired
};

然后我可以打电话：

this.context.router.transitionTo(/path-to-link);

如果您使用的是React路由器的browserHistory，则生活会更简单

import {browserHistory} from "react-router";

functionName() {
 browserHistory.push("/path-to-link");
}

在使用react路由器浪费时间之后，我终于切换到基本javascript

为重定向创建组件：

 componentDidMount() {
      if (typeof window !== 'undefined') {
           window.location.href = "http://foo.com/error.php";
      }
 }

路由路径=“*”组件={NotFound}

在组件中，使用window.location重定向：

 componentDidMount() {
      if (typeof window !== 'undefined') {
           window.location.href = "http://foo.com/error.php";
      }
 }


在这种情况下，我通常使用
hashHistory
或
browserHistory
，具体取决于您使用的内容，只需调用
hashHistory.push（）
。如果您使用的是ES6类，您也可以使用react router提供的
withRouter
Hoc，如上所述。这个高阶组件在您的组件中公开了一个名为
router
的道具。使用此道具，您可以使用
this.props.router.push（）重定向

如果你必须从上下文中使用路由器，你必须提供@Ben的答案中提到的上下文类型。
使用
useHistory
获取历史对象并点击它以更改url

import { useHistory } from 'react-router-dom';

export default function ModificarUsuario({ url }) {
  const history = useHistory();
  
  function newRoute(){
    history.push('/my-route')
  }
}

使用
链接
来自
反应路由器dom
，在我的代码片段中，我使用的是
材料ui

从“react router dom”导入{Link}；
入室
谢谢@paulshen。不幸的是，我使用的是ES6类，所以我不能使用mixin。我不确定这是否可行，但我正在尝试导入导航方法，例如从“react router”导入{Navigation}
。。。正在尝试查看这是否可能，在我现在试图弄清楚的转换中，遇到了一些与此.context有关的问题。错误：“react router”不包含名为“browserHistory”的导出。browserHistory的使用方式已更改。问题是react router——如果你主张不使用该工具，你应该详细解释为什么它不起作用，而不是落入。如果您想使用JavaScript中的位置执行某些操作，可以使用window.location。没有理由认为react outer应该有任何不同。链接断开了，我今天遇到了类似的问题，现在有更好的解决方案吗？请解释您的短代码片段以及如何使用它。