새로운 반응 프로젝트를 만들었습니다. 저는 반응이 처음이고 텍스트를 클릭한 후 탐색하려고 하는데 이 오류가 발생합니다.

잡히지 않은 런타임 오류: × 오류 useNavigate()는  구성요소의 컨텍스트에서만 사용될 수 있습니다. 불변 (http://localhost:3000/static/js/bundle.js:1123:11) useNavigateUnstable(http://localhost:3000/static/js/bundle.js:66522:102)에서 useNavigate에서 (http://localhost:3000/static/js/bundle.js:66519:46) 앱에서 (http://localhost:3000/static/js/bundle.js:83:81) renderWithHooks에서 (http://localhost:3000/static/js/bundle.js:26618:22) mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:29904:17) BeginWork에서 (http://localhost:3000/static/js/bundle.js:31200:20) HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:16210:18) Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:16254:20) InvokeGuardedCallback (http://localhost:3000/static/js/bundle.js:16311:35) 오류 useNavigate()는  구성요소의 컨텍스트에서만 사용될 수 있습니다. 불변 (http://localhost:3000/static/js/bundle.js:1123:11) useNavigateUnstable(http://localhost:3000/static/js/bundle.js:66522:102)에서 useNavigate에서 (http://localhost:3000/static/js/bundle.js:66519:46) 앱에서 (http://localhost:3000/static/js/bundle.js:83:81) renderWithHooks에서 (http://localhost:3000/static/js/bundle.js:26618:22) mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:29904:17) BeginWork에서 (http://localhost:3000/static/js/bundle.js:31200:20) HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:16210:18) Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:16254:20) InvokeGuardedCallback (http://localhost:3000/static/js/bundle.js:16311:35) 오류 useNavigate()는  구성요소의 컨텍스트에서만 사용될 수 있습니다. 불변 (http://localhost:3000/static/js/bundle.js:1123:11) useNavigateUnstable(http://localhost:3000/static/js/bundle.js:66522:102)에서 useNavigate에서 (http://localhost:3000/static/js/bundle.js:66519:46) 앱에서 (http://localhost:3000/static/js/bundle.js:83:81) renderWithHooks에서 (http://localhost:3000/static/js/bundle.js:26618:22) mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:29904:17) BeginWork에서 (http://localhost:3000/static/js/bundle.js:31200:20) BeginWork$1(http://localhost:3000/static/js/bundle.js:36163:18)에서 PerformUnitOfWork(http://localhost:3000/static/js/bundle.js:35432:16)에서 workLoopSync에서(http://localhost:3000/static/js/bundle.js:35355:9)

이 문제에 대한 해결책을 찾을 수 없습니다.

이런 중문을 사용하는 사람들이 있습니다. app.js代码：

'./logo.svg'에서 로고 가져오기; import './App.css'; './comComponents/LoginForm'에서 LoginForm을 가져옵니다. './signup'에서 가입 가져오기; import { BrowserRouter as Router, Routes, Route, Link, useNavigate } from 'react-router-dom'; 함수 앱() { const Navigate = useNavigate(); const handlerSignUpClick = () => { 탐색('/가입'); } 반품 ( <라우터> 
 
  가입하기  
 <경로> <경로 경로="/" 요소={} /> <경로 경로="/signup" 요소={} />  
  ); } 기본 앱 내보내기;

这是LoginForm.js의 대표:

'react'에서 React, { useState } 가져오기; import { Button, Form, FormGroup, Label, Input, InputGroup } from 'reactstrap'; 'react-icons/fa'에서 { FaEye, FaEyeSlash }를 가져옵니다. 함수 로그인폼() { const [사용자 이름, setUsername] = useState(''); const [password, setPassword] = useState(''); const [showPassword, setShowPassword] = useState(false); const handlerSubmit = (이벤트) => { //제출 처리 } const 토글ShowPassword = () => { setShowPassword(!showPassword); } 반품 ( 
 
 <양식그룹> 사용자 이름 <입력 유형="텍스트" name="사용자 이름" id="사용자 이름" 값={사용자 이름} onChange={e => setUsername(e.target.value)} />  <양식그룹> <레이블="비밀번호">비밀번호 <입력그룹> <입력 유형={showPassword ? '텍스트' : '비밀번호'} 이름="비밀번호" id="비밀번호" 값={비밀번호} onChange={e => setPassword(e.target.value)} /> <버튼 onClick={toggleShowPassword}> {표시비밀번호 ?  : }    
 <버튼>제출 
  
 ); } 기본 로그인 양식 내보내기

signup.js의 대표:

가져오기 './App.css'; 함수 사인업() { 반품 ( 

      
애플리케이션
 ); } 기본 가입 내보내기;