做項目的時候給 FormData 里append進去數據后,在控制台 console.log 一下,結果是一個空的。很奇怪,查了資料后知道原來 FormData 是一種特殊類型的對象,它不能進行字符串化,所以在控制台打印不出來結果。
可以這樣打印結果:
let formData = new FormData() for (let [key, value] of Object.entries(this.form)) { // 這里就需要key是與后台定好的接口字段的英文名 if (value != null && value != '') { formData.append(key, value) } } console.log(formData,'formData'); // 這里打印為空 let bdsy = formData.get("bdsy") console.log(bdsy); // 這里可以打印出formData中的bdsy屬性
也可以這樣打印結果:
formData.forEach((value, key) => { console.log("key %s: value %s", key, value); })
這里摘抄FormData常用方法(鏈接)
一.創建一個formData對象實例的方式 1、創建一個空對象 var formData = new FormData();//通過append方法添加數據 2、使用已有表單來初始化對象 //表單示例 <form id="myForm" action="" method="post"> <input type="text" name="name">名字 <input type="password" name="psw">密碼 <input type="submit" value="提交"> </form> //方法示例 // 獲取頁面已有的一個form表單 var form = document.getElementById("myForm"); // 用表單來初始化 var formData = new FormData(form); // 我們可以根據name來訪問表單中的字段 var name = formData.get("name"); // 獲取名字 var psw = formData.get("psw"); // 獲取密碼 // 當然也可以在此基礎上,添加其他數據 formData.append("token","kshdfiwi3rh"); 二. 操作方法 formData里面存儲的數據是以健值對的形式存在的,key是唯一的,一個key可能對應多個value。 如果是使用表單初始化,每一個表單字段對應一條數據,它們的HTML name屬性即為key值,它們value屬性對應value值。 1.獲取值 //通過get(key)/getAll(key)來獲取對應的value formData.get("name"); // 獲取key為name的第一個值 formData.get("name"); // 返回一個數組,獲取key為name的所有值 //通過append(key, value)來添加數據,如果指定的key不存在則會新增一條數據,如果key存在,則添加到數據的末尾 formData.append("k1", "v1"); formData.append("k1", "v2"); formData.append("k1", "v3"); 獲取值時方式及結果如下 formData.get("k1"); // "v1" formData.getAll("k1"); // ["v1","v2","v3"] 3.設置修改數據 //set(key, value)來設置修改數據,如果指定的key不存在則會新增一條,如果存在,則會修改對應的value值 formData.append("k1", "v1"); formData.set("k1", "1"); formData.getAll("k1"); // ["1"] 4.判斷是否存在對應數據 //has(key)來判斷是否對應的key值 formData.append("k1", "v1"); formData.append("k2",null); formData.has("k1"); // true formData.has("k2"); // true formData.has("k3"); // false 5.刪除數據 //delete(key)刪除數據 formData.append("k1", "v1"); formData.append("k1", "v2"); formData.append("k1", "v1"); formData.delete("k1"); formData.getAll("k1"); // []