我有一個非常基本的專案，在這個專案中有下一個 js 我有一個簡單的表單。當我提交此表單時，我使用 append 方法將我的資料放入表單資料中，然后當我在控制臺中記錄我的表單資料時，它是一個空物件，我很想知道為什么會發生這種情況，這是我的代碼
import styles from '../styles/Home.module.css'
import {useState} from "react";
export default function Home() {
const [inputs, setInputs] = useState({
name: '',
mobile: ''
});
const changeHandler = (e) => {
setInputs(prev => {
const cloneState = {...prev};
cloneState[e.target.name] = e.target.value;
return cloneState;
});
}
const clickHandler = (e) => {
e.preventDefault();
const formData = new FormData();
formData.append('name', inputs.name);
formData.append('mobile', inputs.mobile);
console.log(formData, 'FD');
}
return (
<div className={styles.container}>
<form>
<input type="text" onChange={changeHandler} name='name'/>
<input type="text" onChange={changeHandler} name='mobile'/>
<button type='submit' onClick={clickHandler}>Submit</button>
</form>
</div>
)
}提前謝謝大家
uj5u.com熱心網友回復：
如果您在控制臺中記錄 formData 物件，它將記錄 formData 物件。您需要呼叫“get”方法來獲取值。如果您想從 formData 物件中獲取 json，請使用以下代碼。
console.log(Object.fromEntries(formData))
uj5u.com熱心網友回復：
實體的型別FormData不是普通的 JS 物件，而是一個FormData物件，因此不能直接將其登錄到控制臺。
要檢查其條目，您可以執行以下操作：
[...formData.entries()].forEach(e => console.log(e))
uj5u.com熱心網友回復：
與從 formData 獲取值有關的問題。您可以使用 get() 方法或 getAll() 從 formData 獲取資料，以便獲取陣列中具有相同名稱的所有值。要從 formData 中獲取所有值，您可以使用 for...of 回圈，就像這樣。
for (let value of formData.values()) {
console.log(value);
}
希望對你有幫助。謝謝）
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/464306.html
標籤：javascript 反应 形式 下一个.js 表单数据