ReactJS web app中的导航不工作

Question

import React from 'react';
import './Navbar.css';
import Linux from './Linux'


function Navbar(){
    return(
        <nav className="navbar navbar-expand-lg navbar-dark bg-dark">
  <a className="navbar-brand" href="#">Learn to Code</a>
  <button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span className="navbar-toggler-icon"></span>
  </button>

  <div className="collapse navbar-collapse" id="navbarSupportedContent">
    <ul className="navbar-nav mr-auto">
      <li className="nav-item active">
        <a className="nav-link" href="#">Home <span className="sr-only">(current)</span></a>
      </li>
      <li className="nav-item">
        <a className="nav-link" href="">Development</a>
      </li>
      <li className="nav-item">
        <a className="nav-link" href="./Linux">Linux</a>
      </li>

我尝试使用react-router-dom。如何在react应用程序中导航到其他页面？

这就是我添加react-router-dom链接方法的方式。

import Link from 'react-router-dom';

<li className="nav-item">
        <Link to='/Linux'></Link>
</li>

然后我收到以下错误：尝试导入错误：“react-router-dom”不包含默认导出（作为“link”导入）。

Answer 1

您可以关注这篇文章，在这里，我尝试给出一些关于导航如何工作和如何编写代码的更详细的想法。希望对你有帮助