[Vuejs]-Vue saves image on wrong component when file @change is used

by

2👍

✅

You are having dulicated id for extra_image. Thus every click on label + is firing the first hidden file input.

To fix this, you just need to give different ids based on block_index:

    <input
      :id="`extra_image_${block_index}`"
      class="hidden"
      name="extra_image"
      type="file"
      accept="image/*"
      @change="add_extra_image($event)"
    >
    <label :for="`extra_image_${block_index}`" class="extra_image">
      <span class="icon">+</span>
    </label>

Leave a comment