Yas*_*ksi 9 reactjs react-router
我想将我的 reactjs 页面重定向到常规的 html 页面，按下点击我像链接按钮。
这是我的代码：
应用程序.js
import React, { Component } from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';
import './App.css';
// import DoctorImg from './doctor.jpg';
class App extends Component {
render() {
return (
<Router>
<div>
<Link to="/Users/yashchoksi/Documents/route/src/normal_redirect.html">Press</Link>
<Switch>
<Route exact path="/Users/yashchoksi/Documents/route/src/normal_redirect.html"/>
</Switch>
</div>
</Router>
);
}
}
export default App;
其他文件是
normal_redirect.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check this.</title>
</head>
<body>
<p>This is redirected page.</p>
</body>
</html>
要静态链接到不同的页面，只需使用标准的 HTML 锚标记：
<a href="normal_redirect.html">Redirect to Html page</a>
当用户点击链接时，这是一个正常的页面导航到href标签的值。
要动态地将用户发送到另一个页面，请使用<Route>组件的render属性：
<Route exact path="/normal_redirect" render={() => {window.location.href="normal_redirect.html"}} />
本质上，使用Route组件的render属性告诉浏览器导航到不同的页面：https : //reacttraining.com/react-router/web/api/Route
尝试这个：
class App extends Component {
render() {
return (
<div>
<a href="/Users/yashchoksi/Documents/route/src/normal_redirect.html">Press</a>
</div>);
}
}
请注意如何我已经删除了Router，Route，Switch，并Link从代码组件。对于普通链接，您不需要它们中的任何一个。
小智 5
在我的例子中，您的 HTML 必须位于您的公共文件夹中terminos.html
App.js，添加以下代码： <Route exact path="/terminos" render={() => {window.location.href="terminos.html"}} />
<a/>，请添加以下代码： <a target="_blank" href={process.env.PUBLIC_URL + "terminos.html"} > terminos</a>
| 归档时间： |
|
| 查看次数： |
14103 次 |
| 最近记录： |