I am using django-rest-framework as my backend and I want to upload an Image from the frontend(vuejs2) note: the backend works perfectly and I can upload the photo using django admin

CodePudding user response：

I assume your backend accept multipart/form-data and using axios

<input type="file" @change="onFileChange" />

export default {
  methods: {
    onFileChange(e) {
      const formData = new FormData();
      formData.append("file", e.target.files[0]);
      axios
        .post("/upload", formData)
        .then(() => {
          console.log("SUCCESS");
        })
        .catch(() => {
          console.log("FAILED");
        });
    },
  },
}