Javascript插入对象以形成数据

Question

我想将一个对象转换为表单数据。在我必须向这个对象添加一个对象之前，我没有问题。

如何将 json 对象添加到我的表单数据中？

这是我要转换为 formData 的对象，它必须保持完全相同的格式。

{
"product": { 
    "name": "Produit Comp 2",
    "abbreviation": "prod_comp_2",
    "quantity": 4,
    "weight": 100,
    "tva": 21,
    "size": 10,
    "height": 24,
    "width": 23,
    "category_id": 91,
    "sub_category_id": 88,
    "status": 1,
    "price_unit": {
        "price_day_1": 73.43,
        "price_day_2": 74.43,
        "price_day_3": 75.43
    },
    "price_loaded": {
        "price_day_1": 75.43,
        "price_day_2": 76.43,
        "price_day_3": 77.43
    },
    "price_installation": {
        "price_day_1": 78.43,
        "price_day_2": 79.43,
        "price_day_3": 70.43
    },
    "price_built_delivered": {
        "price_day_1": 71.43,
        "price_day_2": 72.43,
        "price_day_3": 73.43
    }
}}

这是我要转换的实际功能。 我的表单数据只缺少 price_unit、price_loaded、price_installation、price_built_delivered 对象。如何添加它们？

    private toProductDto(product: Product): FormData {
    console.log('service', product);
    let formData = new FormData();
    if (product.id) { formData.append('id', '' + product.id); }
    if (product.name) { formData.append('name', product.name); }
    if (product.category) { formData.append('category_id', '' + product.category.id); }

    // Set subcategory to null if it's not defined on sending
    if (product.sub_category) {
        formData.append('sub_category_id', '' + product.sub_category.id);
    } else {
        formData.append('sub_category_id', null);
    }

    formData.append('status', '' + product.status);
    if (product.image) { formData.append('image', product.image, product.image.name); }
    if (product.description) { formData.append('description', '' + product.description); }
    if (product.quantity) { formData.append('amount', '' + product.quantity); }
    if (product.weight) { formData.append('weight', '' + product.weight); }
    if (product.length) { formData.append('length', '' + product.length); }
    if (product.width) { formData.append('width', '' + product.width); }
    if (product.height) { formData.append('height', '' + product.height); }
    if (product.tva) { formData.append('tva', '' + product.tva); }
    if (product.options) { formData.append('options', '' + product.options); }
    if (product.numbers_players) { formData.append('numbers_players', '' + product.numbers_players); }
   return formData;
}

提前感谢您的帮助。

Answer 1

这是我要转换为 formData 的对象，它必须保持完全相同的格式。

这本身是不可能的。 FormData 表示一组flat key=value 对。

您需要进行某种形式的序列化。

例如带有JSON.stringify 或PHP 样式的键名，其中带有[]。

然后您必须在服务器端代码中解码序列化结构。

Answer 2

我终于找到了解决办法，这里是：

    private toProductDto(product: Product): FormData {
    console.log('service', product);
    const formData = new FormData();
    if (product.id) { formData.append('[product][id]', '' + product.id); }
    if (product.name) { formData.append('[product][name]', product.name); }
    if (product.name) { formData.append('[product][abbreviation]', product.abbreviation); }
    if (product.category) { formData.append('[product][category_id]', '' + product.category.id); }

    // Set subcategory to null if it's not defined on sending
    if (product.sub_category) {
        formData.append('[product][sub_category_id]', '' + product.sub_category.id);
    } else {
        formData.append('[product][sub_category_id]', null);
    }

    formData.append('[product][status]', '' + product.status);
    if (product.image) { formData.append('[product][image]', product.image, product.image.name); }
    if (product.description) { formData.append('[product][description]', '' + product.description); }
    if (product.quantity) { formData.append('[product][quantity]', '' + product.quantity); }
    if (product.weight) { formData.append('[product][weight]', '' + product.weight); }
    if (product.length) { formData.append('[product][length]', '' + product.length); }
    if (product.width) { formData.append('[product][width]', '' + product.width); }
    if (product.height) { formData.append('[product][height]', '' + product.height); }
    if (product.tva) { formData.append('[product][tva]', '' + product.tva); }
    if (product.options) { formData.append('[product][options]', '' + product.options); }
    if (product.numbers_players) { formData.append('[product][numbers_players]', '' + product.numbers_players); }


    if (product.price_unit) { formData.append('[product][price_unit][price_day_1]', '' + product.price_unit.price_day_1); }
    if (product.price_unit) { formData.append('[product][price_unit][price_day_2]', '' + product.price_unit.price_day_2); }
    if (product.price_unit) { formData.append('[product][price_unit][price_day_3]', '' + product.price_unit.price_day_3); }

    if (product.price_loaded) { formData.append('[product][price_loaded][price_day_1]', '' + product.price_loaded.price_day_1); }
    if (product.price_loaded) { formData.append('[product][price_loaded][price_day_2]', '' + product.price_loaded.price_day_2); }
    if (product.price_loaded) { formData.append('[product][price_loaded][price_day_3]', '' + product.price_loaded.price_day_3); }

    if (product.price_installation) { formData.append('[product][price_installation][price_day_1]', '' + product.price_installation.price_day_1); }
    if (product.price_installation) { formData.append('[product][price_installation][price_day_2]', '' + product.price_installation.price_day_2); }
    if (product.price_installation) { formData.append('[product][price_installation][price_day_3]', '' + product.price_installation.price_day_3); }

    if (product.price_built_delivered) { formData.append('[product][price_built_delivered][price_day_1]', '' + product.price_built_delivered.price_day_1); }
    if (product.price_built_delivered) { formData.append('[product][price_built_delivered][price_day_2]', '' + product.price_built_delivered.price_day_2); }
    if (product.price_built_delivered) { formData.append('[product][price_built_delivered][price_day_3]', '' + product.price_built_delivered.price_day_3); }

    console.log(formData);
    return formData;
}