CODEWITHSUNDEEP
javascriptreactjs
Jens Bouma
Jens Bouma

Reputation: 149

React-router-dom's Redirect not doing anything

I'm working on an authentication system (What I'm currently testing without sending the data) The <Redirect to"(path)"> is not doing anything. Am I doing something wrong down here?

import React, { Component } from 'react';
import { withRouter, Link, Redirect, useHistory } from 'react-router-dom';


class Login extends Component {
    constructor(props) {
        super(props);
        this.state = {
            email: '',
            password: '',
        };
    } 
    login(event) {
        event.preventDefault();
        return <Redirect to="/home"></Redirect>
    }
    render() {
        return (
            <div className="login">
                <img src="images/tradecast-logo.png"/>
                <h2>Employee Management System</h2>
                <form onSubmit={this.login}>
                    <h1>Inloggen</h1>
                    <p>E-mail</p>
                    <input type="text" name="email" placeholder="E-mail" />
                    <p>Wachtwoord</p>
                    <input type="password" name="password" placeholder="Wachtwoord"/>
                    <Link to="/forgot-password">Wachtwoord vergeten</Link>
                    <div className="btns">
                        <button type="submit">Aanmelden</button>
                        <Link className="btn-register" to="/register">Registreren</Link>
                    </div>
                </form>
                <p className="copyright">&copy; {new Date().getFullYear()} TradeCast Employee Management by Jens Bouma</p>
            </div>
        )
    }
}
        
export default withRouter(Login);

Upvotes: 0

Views: 67

Answers (2)

Ashish Mishra
Ashish Mishra

Reputation: 422

Redirect will be work inside the render function this.context.history.push("/home")

     this.context.history.push("/home")

Upvotes: 0

diane
diane

Reputation: 171

As what was said here, Redirect must be rendered not just returned. As an alternative, since you are using a class component, you can use this.props.history.push("/home”) instead.

Upvotes: 2

Related Questions