Reset form after submit when transforming data

[talelmishali]

Hello all!
I have a file uploader component which $emit a file event together with: this.$refs.files.files , on the parent I just push the file instance into an array before submitting it to the server. I would like to reset the array after the successful submission of the form.
Everything works fine and I can upload images, the only problem is if I do not refresh the page imagesArray will preserve the already uploaded images which can lead to duplication if the client did not refresh the page.
At the moment that's what I got:

data() {
    return {
      imagesArray: [],
      featureImage: "",
      imagesPath: this.data.images_path,
      removePhotos: [],
      form: this.$inertia.form({
        _method: "PUT",
        title: this.data.title,
        nnumber: this.data.nnumber,
        description: this.data.description,
        is_premium: this.data.is_premium,
        rate: this.data.rate,
      }),
    };
  },

and a method to submit the form:

    updateAirplaneInformation(id) {
      this.form
        .transform((data) => ({
          ...data,
          remove_photos: this.removePhotos,
          images_path: this.imagesArray,
          img_path: this.featureImage,
        }))
        .post(route("airplanes.update", id), {
          preserveScroll: true,
        });
    },

Thank you all in advance!

[ajnsn]

@talelmishali The form helper also has some of the Inertia event callbacks like onSuccess. This should work:

updateAirplaneInformation(id) {
    this.form
        .transform(data => ({
            ...data,
            remove_photos: this.removePhotos,
            images_path: this.imagesArray,
            img_path: this.featureImage,
        }))
        .post(route('airplanes.update', id), {
            preserveScroll: true,
            onSuccess: page => {
                // Clear your array here
            },
        });
},

[talelmishali]

Thank you!

[adgower]

I solved it this way:

<form
          @submit.prevent="
            form.post(route('article.store'), {
              onSuccess: () => {
                form.reset();

                this.$refs.image.value = null;
              },
            })
          "
        >