如何使用哈希<Link>路由器更改位置的路径名



我使用HashRouter。假设我想导航到http://localhost:8089/abc/#/home,我可以使用window.history.pushState({}, '', 'http://localhost:8089/abc/#/home')来完成。

我的问题是如何使用react路由器的<Link>api来进行同样的导航。我试过<Link to="/#/home">,它不起作用。

问题2:我得到了一个urlhttp://localhost:8089/abc/#/app1,我想导航到http://localhost:8089/aaa/#/home。我尝试了<Link to="/aaa/#/home">,但它导航到urlhttp://localhost:8089/abc/#/aaa/#/home

以下是路由器配置:

import React, {Component} from 'react';
import {BrowserRouter as Router, HashRouter, Route} from 'react-router-dom';
import App from '../containers/app';

class Routes extends Component {
render() {
return (
<HashRouter basename="/">
<Route path="/" component={App} />
</HashRouter>
)
}
}
export default Routes;

谢谢。

如果您想使用Link,可以尝试:

<Link to="/abc/#/home/" />

如果你想使用useHistory挂钩

import { useHistory } from "react-router-dom";
function Home() {
let history = useHistory();
function handleClick() {
history.push("/abc/#/home");
}
}

编辑:我知道如何使用RouterSwitch而不是使用HashRouter

import { Router } from "react-router-dom";
const history = createBrowserHistory();
<Router history={history}>
<Switch>
<Route exact path="/" component={Home} /> // localhost:8089/
<Route exact path="/abc/home" component={Home2} /> // localhost:8089/abc/home
</Switch>
</Router>

然后你可以使用链接如上

首先使用链接import Linking fro react-native;

然后实现以下方法。

onPress={() =>  Linking.openURL("URL of page // path of page").catch(err =>
console.error("Couldn't load page", err),
)  }

希望它停止,不要怀疑。

最新更新