Entonces, en la versión anterior de React, pude usar Redirigir para cambiar de una página a otra cuando usaba alguna condición sobre si cambiaría. Pero con la redirección v6 ya no se puede utilizar.
import React, {useState, Redirect, useNavigate} from 'react'; import './App.css'; import {Link} from 'react-router-dom' function Main() { const handleLogInUsernameChange = (event) => { setLogInUsername(event.target.value) } const handleLogInPasswordChange = (event) => { setLogInPassword(event.target.value) } let navigate = useNavigate(); function RedirectTo(){ navigate('/dashboard') } function checkLogInCred(){ fetch("https://api.apispreadsheets.com/data/xxxxxxxxxxxxxxxxxxx/").then(res=>{ if (res.status === 200){ // SUCCESS res.json().then(data=>{ const yourData = data for(var a = 0; a < yourData.data.length - 1;a++){ if(yourData.data[a].Password === logInPassword && yourData.data[a].UserName === logInUsername) { logInStatus = "Logged" console.log("You have logged in") a = yourData.data.length //<Redirect to="/dashboard" /> RedirectTo() } } }).catch(err => console.log(err)) } else{ // ERROR } }) //navigate('/dashboard') } return ( <div> <p> <input type="text" placeholder="Enter username" onChange={handleLogInUsernameChange}></input> </p> <p> <input type="text" placeholder="Enter password" onChange={handleLogInPasswordChange}></input> </p> <p> <button onClick={checkLogInCred}>Login</button> </p> </div> ); } export default Main;Parece que todo solo funciona solo en funciones onClick
import {useNavigate} from "react-router-dom";useNavigate es parte de react-router-dom no React.
En tu caso, será algo como:
import {Link,useNavigate} from 'react-router-dom'useNavigate se importa de react-router-dom, por lo que en su caso:
importar {Link,useNavigate} desde 'react-router-dom';
lo estás importando desde entonces reacciona.
import React, {useState, Redirect, useNavigate} from 'react';importarlo desde react-router-dom
import { useNavigate } from "react-router-dom";Espero que resuelva la redirección.