gpt4 book ai didi

react-router - 有没有办法在 HashRouter 和 react-router v4 中使用历史记录?

转载 作者:行者123 更新时间:2023-12-03 23:59:30 27 4
gpt4 key购买 nike

我需要将用户重定向到 React 组件之外,这通常是使用 history 完成的。与 react 路由器。

// history.js
const history = createBrowserHistory();
export default history;

// App, setting up router
import { HashRouter as Router } from 'react-router-dom';
import history from './history';
...
<HashRouter history={history}>...</HashRouter> // problem

// Non-component file
import history from './history';
history.push('/target');
HashRouter不接受历史 Prop ,而是在内部处理历史,并指示开发人员使用 withRouter为了曝光 history对于组件,如何在组件外部进行重定向并不明显。
我正在使用 HashRouter我需要使用 history在组件之外(意味着我不能使用 withRouter )。
我怎么能做到这一点?

最佳答案

是的,有一种方法可以使用 history和一个基于哈希的路由器在一起。
创建历史实例时,使用 createHashHistory而不是 createBrowserHistory .

// myCreatedHistory.js
import { createHashHistory } from 'history';
export default createHashHistory();
而不是使用 HashRouter ,使用低级 Router相反,并通过 history Prop 给它,像这样。
// App
import { Router } from 'react-router-dom';
import history from '../myCreatedHistory';
...
<Router basename="/" history={history}>...</Router>
然后你可以导入 history从任何地方(比如中间件)。
// Middleware, or anywhere
import history from '../myCreatedHistory';
history.push('/target');

关于react-router - 有没有办法在 HashRouter 和 react-router v4 中使用历史记录?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63612097/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com