[Vuejs]-How do I send an image to a PHP API using VueJS?

0๐Ÿ‘

โœ…

if you want to send an image to an api.

  1. You form should specify the type de data you must send for

    your form. you should add this.

     <form  enctype="multipart/form-data">
      <input type="text" class="form-control" v-model="myData.text" />
      <input type="file" class="form-control" @change="handleUpload($event.target.files)" />
     </form>
    

In your script you need to set this methods

 data () {
    return {
      myData: {
       text: '',
       photo: null
      }
     }
    },
    methods: {
        handleUpload(files) {
          this.myData.photo = files[0];
        },
       saveProductImage () {
          let formData = new FormData()
          formData.append('text', this.myData.text);
          formData.append('photo', this.myData.photo);
          
          // Send here
       }
    }

Please check the docs

Leave a comment