我在导航栏里有signIn和signUp。
我的"/“路径呈现SignUp组件,SignUp组件有一个带有输入和按钮的表单。
在总结表单或单击按钮时,我应该被带到("/signin") SignIn页面,该页面呈现我的signIn组件。
但是,我的问题是,一旦我单击按钮或求和它仍然停留在("/") signUp页面中,并且没有导航到signIn页面("/signin")
代码:
import { Redirect } from "react-router-dom";
function Signup() {
const handleClick = () => {
<Redirect to="/signin" />;
};
return (
<div>
<form>
<label>
Enter Mobile Number
</label>
<input />
<button onClick={handleClick} >
Get OTP
</button>
</form>
</div>
);
}
export default Signup;App.js
function App() {
return (
<Router>
<div>
<Nav />
<Switch>
<Route exact path="/" component={Signup} />
<Route path="/signin" component={SignIn} />
</Switch>
</div>
</Router>
);
}我试着解决这个问题,,
我裹在纽扣里:
<button onClick={handleClick} >
<Link to="/signin"> Get OTP </Link>
</button>我也尝试了onSumbit的形式而不是onClick。
发布于 2021-06-01 13:41:45
一种方法是在如下的Link元素中进行组合:
import { Link } from "react-router-dom";
<Link to='/'>
<button>
Redirect to home
</button>
</Link>至于形式,你可以这样做:
import { history } from "react-router-dom";
<form onSubmit={() => history.push("/")}>
...
</form>https://stackoverflow.com/questions/67789726
复制相似问题