Redirect component doesn't change url (React) - reactjs

Question

I am building Signup component which should redirect to the root path if user has passed all information.
However, Redirect component doesn't work for some reason, as url is not changed. On line 12 I am logging in renderRedirect and I can see this message in my console so I am inside renderRedirect method but, like I said, url stays the same localhost:3000/signupm instead of changing to localhost:3000/.
Any idea why?
import React from "react";
import { Redirect } from "react-router-dom";
class Signup extends React.Component {
state = {
password: "",
fullName: "",
email: ""
};
renderRedirect = () => {
console.log("in renderRedirect");
return <Redirect push to="/" />;
};
handleInputChange = e => {
const value = e.target.value;
const name = e.target.name;
this.setState({ [name]: value });
};
handleSignup = () => {
this.props.onSignup(
{
username: this.state.username,
password: this.state.password,
fullName: this.state.fullName,
email: this.state.email
},
() => this.renderRedirect()
);
};
render() {
return (
<div className="login-wrap">
<h2>Sign Up</h2>
<div className="form">
<input
type="text"
placeholder="Full Name"
name="fullName"
value={this.state.fullName}
onChange={this.handleInputChange}
/>
<input
type="email"
placeholder="Email address"
name="email"
value={this.state.email}
onChange={this.handleInputChange}
/>
<input
type="password"
placeholder="Password"
name="password"
value={this.state.password}
onChange={this.handleInputChange}
/>
<button onClick={this.handleSignup}>Sign up</button>
</div>
</div>
);
}
}
export default Signup;

Answer 1

I would omit the 'push' from the redirect component and see if that works. Otherwise, you could make use of the history object and use this.props.history.push('/') instead. If you don't have access to the routeProps, you can wrap your Signup Component with { withRouter } from 'react-router-dom'