reactjs – 使用react-router-redux,如何以编程方式重定向到URL

发布时间：2020-12-15 05:04:00 所属栏目：百科来源：网络整理

导读：如何在给定以下包的情况下以编程方式重定向到URL： "react-dom": "^15.5.4","react-redux": "^5.0.4","react-router-dom": "^4.1.1","react-router-redux": "^5.0.0-alpha.6", 我有这个工作： import React from 'react';import createBrowserHistory from '

如何在给定以下包的情况下以编程方式重定向到URL：

"react-dom": "^15.5.4","react-redux": "^5.0.4","react-router-dom": "^4.1.1","react-router-redux": "^5.0.0-alpha.6",

我有这个工作：

import React from 'react';
import createBrowserHistory from 'history/createBrowserHistory';

class WorkPlacePage extends React.Component {
  render() {
    const history = createBrowserHistory();
    return (
      <div>
        <button onClick={() => history.push('/welcome/skills')}>next page</button>
      </div>
    );
  }
}

export default WorkPlacePage;

上面的问题是,当浏览器的URL发生变化时,react应用程序似乎并未将URL更改视为重定向.应该由URL触发的react应用程序组件永远不会像url硬刷新时那样运行react组件逻辑…

如何以编程方式触发React App加载新URL的URL重定向？

谢谢！

如果使用较新的react-router API,则需要在组件内部使用this.props中的历史记录,这样：

this.props.history.push('/some/path');

但是,这可能仅用于以编程方式更改URL,而不是实际导航到页面.您应该在路由器配置文件中将组件映射到此URL,如下所示.

<BrowserRouter>
      <div>
        <Switch>
            <Route path="/some/path" component={SomeComponent} />
            <Route path="/" component={IndexComponent} />
        </Switch>
      </div>
</BrowserRouter>

希望这可以帮助.快乐的编码！

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!