我无法在我的反应应用程序中呈现最后一条路线答案

【问题标题】：I couldnt render the last route in my react app我无法在我的反应应用程序中呈现最后一条路线
【发布时间】：2022-08-02 18:12:13
【问题描述】：

一切都完美呈现，除了最后一条路线是 Signup。它甚至将我带到 SIgnup 页面，其中除了注册组件之外呈现导航栏和背景我不知道它是否有帮助，但我添加了注册路线比我晚了一段时间以前的

这是 App.js 的代码

import Navbar from \"./components/Navbar.js\"
import {Routes,Router, Route} from \"react-router-dom\"
import Home from \"./components/Home\"
import Register from \"./components/Register.js\";
import Loan from \"./components/Loan.js\";
import Return from \"./components/Return.js\";

import React from \"react\";
import Signup from \"./components/Signup.js\";
function App() {

  const [loanBooks, setLoanBooks] = React.useState()
  console.log(loanBooks)
  return ( 
    <div>


      <Navbar />
      

        <Routes>
          <Route path=\'/\' element={<Home/>} />
          <Route path=\'/Register\' element={<Register passBook ={book=>setLoanBooks(book)}/>} />
          <Route path=\'/Loan\' element={<Loan bookInfo={loanBooks}/>} />
          <Route path=\'/Return\' element={<Return/>} />
          <Route path=\'./Signup\' element={<Signup/>}/>
        </Routes>


      
      {/* <Signup /> */}
    
    </div>

   
  );
  
}

export default App;

这是 Signup.js 的代码

    import React from \'react\'

function Signup() {
  return (
    <div className=\'container\'>
        
            <form className=\'login-form\' action=\"\">
            <h1 className=\'header\'>SIGNUP</h1>
            <hr />
             <div className=\"mover\">
                <input className=\'login-info\' name=\"fName\" type=\"text\" placeholder=\'First Name\' />
                <input className=\'login-info\' name=\"Lname\" type=\"text\" placeholder=\'Last Name\' />
                <input className=\'login-info\' name=\"Email\" type=\"Email\" placeholder=\'Insert Email\' />
                <input className=\'login-info\' name=\"phoneNo\" type=\"Number\" placeholder=\'Phone no\' />
                <input className=\'login-info\' name=\"password\" type=\"Password\" placeholder=\'Password\'/>
                <input className=\'login-info\' name=\"confirmPassword\" type=\"Password\" placeholder=\'Confirm Password\'/>
             </div>
                
                

                <button className=\'btn\'>Sign up</button>
                
            </form>

        

    </div>
  )
}

export default Signup

标签： reactjs react-router-dom

【解决方案1】：

从./Signup 中删除.，因此您的路线应如下所示

<Route path='/Signup' element={<Signup/>}/>

【讨论】：