我正在做一個登錄表單，我得到了一個奇怪的行為，即每當我點擊 "登錄 "按鈕時，頁面只是重新加載，沒有通過 "submitHandler "函式登錄我的電子郵件和密碼。 下面是表單的代碼（我洗掉了很多額外的CSS格式和div）。
import React from 'react' /span>
import { useState, useEffect } from "react";
import { useDispatch, useSelector } from "react-redux"/span>;
import { login } from "./././actions/userActions"。
import { Form, Button, Row, Col } from "react-bootstrap"/span>。
function LoginForm （{history}） {
const [email, setEmail] = useState(""/span>)。
const [password, setPassword] = useState("") 。
const submitHandler=（e）=> {
e.preventDefault（）。
console.log(email, password)
// dispatch(login(email, password));.
};
return (
<form>
< button onSubmit={submitHandler} type="submit">
登錄
</button>/span>登錄
</form>
)
}
export default LoginForm
有沒有人知道為什么點擊登錄按鈕后頁面會重新加載？
uj5u.com熱心網友回復：
問題
該按鈕是type="submit"，但是表單沒有onSubmit處理程式，因此采取了默認的表單操作，即提交表單并重新加載頁面。
解決方案
將onSubmit移到form元素中，這樣回呼就可以阻止默認表單動作的發生。
<form onSubmit={submitHandler}>
<button type="submit"/span>>
登錄
</button>/span>登錄
</form>
uj5u.com熱心網友回復：
嘗試在表單上用onSubmit呼叫submitHandler，而不是在按鈕上。
CodePudding
你也可以將按鈕type=""方法提供者submit轉換為button，在某些情況下，你并不是真的想提交內部表單，所以只要記住就可以了。
下面是這個例子，
<form>
< button onSubmit={submitHandler} type="button">
</form>/span>
其他答案也可以，但我想從不同的角度切入。
。轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/320704.html
標籤：
上一篇：絕對位置的跨頁自動被推離網頁