Home > Software design >  Send Multiple Data With Axios
Send Multiple Data With Axios

Time:03-18

I have a problem , my problem is when i send multiple data with axios , the image in formdata dosen't send , but when i send only the formdata it works , if any know how to send multiple data ins axios just give me what's the solution

 const onSubmit = async (data) => {

        if(loading) return ;
        setLoading(true);

        const formData = new FormData();

        formData.append("image",image);
        
        
        let details = {
            name:data.name,
            image:formData,
            price:data.price,
            description:convertToRaw(editorState.getCurrentContent()).blocks[0].text,   
            qty:data.qty,
            promo:data.oldPrice,
            categorie:data.categorie,
            // images:[image,image2,image3,image4]
        }
        try{
            let config = {
                headers:{
                    authorization:"Authorization Token " jwt,
                    "Accept": "application/json",
                    "Content-Type": "multipart/form-data",
                }
            }
           await axios.post('../../api/products',details,config)
                      .then(res => console.log(res.data))
                      .then(setLoading(false))
                      .catch(err => console.log(err))
        }catch(err){
            console.log(err);
        }
    }

CodePudding user response:

I would do something like this while uploading with images:

 const onSubmit = async (data) => {

        if(loading) return ;
        setLoading(true);

        const formData = new FormData();

        formData.append("image",image);
        
        
        let details = {
            name:data.name,
            price:data.price,
            description:convertToRaw(editorState.getCurrentContent()).blocks[0].text,   
            qty:data.qty,
            promo:data.oldPrice,
            categorie:data.categorie
        }

        for (let key in details) {
            formData.append(key, details[key]);
        }

        try{
            let config = {
                headers:{
                    authorization:"Authorization Token " jwt,
                    "Content-Type": "multipart/form-data",
                }
            }
           await axios.post('../../api/products',formData ,config)
                      .then(res => console.log(res.data))
                      .then(setLoading(false))
                      .catch(err => console.log(err))
        }catch(err){
            console.log(err);
        }
    }
  • Related