我可以在 reactjs 中使用 href 标签吗？

Question

我想在 reactjs 中重定向一个页面，为此我想使用 href 标签，我可以这样做吗？

下面是代码供参考：

import React, { Component } from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';

// import DoctorImg from './doctor.jpg';

class App extends Component {
  render() {
    return (
<Router>
  <Link to = 'https://google.com/'><button>GO GOOGLE</button></Link>

</Router>
    );
  }
}

export default App;

Answer 1

如果您想链接到 React 应用程序之外的网页，则 ​​HTML 锚标记会非常有用：

<a href="https://google.com" target="_blank" rel="noopener noreferrer">Click here</a>

target="_blank"将在新选项卡中打开网页。rel="noopener noreferrer"防止安全风险，更多详细信息请参见此处

如果您想链接到 React 应用程序中的页面，您可能不想使用该标签，因为这会导致整个应用程序重新加载，丢失应用程序的当前状态并导致用户延迟。

在这种情况下，您可能需要使用像react-router这样的包，它可以在您的应用程序中移动用户而无需重新加载它。请参阅 Rijul 的答案以获取该解决方案。

Answer 2

你可以使用 React 中可用的 Link 标签，内部每个 Link 标签都会转换为锚标签

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


<Link to="/Path" > Contact us </Link>