FormData.append()添加字段后值為空？是哪個細(xì)節(jié)導(dǎo)致的？

FormData.append()方法導(dǎo)致字段值為空的常見錯誤及解決方法

在使用FormData.append()向表單添加數(shù)據(jù)時，有時會遇到console.log顯示字段值為空（NULL）的情況。這通常并非FormData對象本身的問題，而是由于代碼細(xì)節(jié)導(dǎo)致的鍵值不匹配。

以下面代碼為例，開發(fā)者使用formData.append(key, value)添加鍵值對。payload對象包含kb_id和doc_id兩個字符串字段。代碼先添加kb_id，console.log(formData.get(‘kb_id’))正確輸出其值。然而，添加doc_id后，console.log(formData.get(‘doc_id’))卻輸出null。

問題根源在于formData.append(‘doc_id ‘, payload.doc_id);這行代碼。注意’doc_id ‘中的額外空格。FormData.get()方法是精確匹配鍵名的，由于添加時鍵名包含空格(“doc_id “)，而獲取時鍵名沒有空格(“doc_id”)，兩者不匹配，導(dǎo)致formData.get(‘doc_id’)返回null。

解決方法很簡單：將formData.append(‘doc_id ‘, payload.doc_id);修改為formData.append(‘doc_id’, payload.doc_id);，去除鍵名中的空格即可。這樣，formData.get(‘doc_id’)就能正確獲取payload.doc_id的值。

總結(jié)： 使用FormData.append()時，務(wù)必確保添加鍵名與獲取鍵名完全一致，包括大小寫和空格。細(xì)微的差別都會導(dǎo)致獲取失敗。 謹(jǐn)慎檢查鍵名拼寫，避免因空格或其他字符差異導(dǎo)致的錯誤。