xgqfrms™, xgqfrms® : xgqfrms's offical website of cnblogs! xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

js FormData All In One

js FormData All In One

query string & form data

js get data from formdata

https://developer.mozilla.org/en-US/docs/Web/API/FormData/values


var formData = new FormData();
formData.append('key1', 'value1');
formData.append('key2', 'value2');

for (var value of formData.values()) {
   console.log(value);
}

https://developer.mozilla.org/en-US/docs/Web/API/FormData/get


var formData = new FormData();

formData.append('username', 'Chris');
formData.append('username', 'Bob');

formData.get('username');

solution

axios put & FormData 实现 重复 key


const params = {
    creative_id: "4838",
    creative_word_ids: "",
    description: ["zzz", 'abc'],
    title: ["111", '222'],
};

// 1. Object 转 FormData
const formData = new FormData();
// ReferenceError: FormData is not defined ❓ Web API

for (const [key, value] of Object.entries(params)) {
    if (Array.isArray(value)) {
        for (const item of value) {
            formData.append(key, item);
        }
    } else {
        formData.append(key, value);
    }
}

console.log('formData.toString() =', formData.toString());

for (const [key, value] of formData.entries()) {
    console.log('key, value =', key, value);
}

// 2. FormData 转 URLSearchParams
// const queryString = new URLSearchParams(forData);
// console.log('queryString.toString() =', queryString.toString());

// for (const [key, value] of queryString.entries()) {
//     console.log('key, value =', key, value);
// }

/*

✅ 实现 重复 key (title / description)

formData.toString() = [object FormData]
key, value = creative_id 4838
key, value = creative_word_ids
key, value = description zzz
key, value = description abc
key, value = title 111
key, value = title 222


*/
      

refs

https://github.com/xgqfrms/learning/issues/116#issuecomment-901721832



©xgqfrms 2012-2020

www.cnblogs.com/xgqfrms 发布文章使用:只允许注册用户才可以访问!

原创文章,版权所有©️xgqfrms, 禁止转载 🈲️,侵权必究⚠️!


posted @   xgqfrms  阅读(61)  评论(15)    收藏  举报
编辑推荐:
· .NET程序启动就报错,如何截获初期化时的问题json
· 理解 C# 中的各类指针
· C#多线程编程精要:从用户线程到线程池的效能进化论
· 如何反向绘制出 .NET程序 异步方法调用栈
· 领域驱动设计实战:聚合根设计与领域模型实现
阅读排行:
· 换个方式用C#开发微信小程序
· .NET程序启动就报错,如何截获初期化时的问题json
· AI 技术发展简史
· Java Solon v3.3.0 发布(国产优秀应用开发基座)
· SpringAI更新:废弃tools方法、正式支持DeepSeek!
历史上的今天:
2020-08-19 how to using js to realize notes feature on the website
2020-08-19 free useful skills videos courses & tutorials
2020-08-19 cookie & session & token compare
2020-08-19 web development all in one
2020-08-19 Firewall & Network Security
2020-08-19 Bastion Host (BH)
2020-08-19 Redis in Action
点击右上角即可分享
微信分享提示