Vue FileUpload Jasny

Pro Component

We have styled the select picker to look similar to the dropdown and the other inputs.

For more information please check Full Github Documentation.

Regular

Select image Change Remove

Copy

<image-upload @change="onImageChange" select-text="Select Image" />

<script>
import ImageUpload from '@/components/ImageUpload';
export default{
  components: {
    ImageUpload
  },
  methods: {
    onImageChange(file) {
      this.images.regular = file;
    },
    onAvatarChange(file) {
      this.images.avatar = file;
    }
  }
}
</script>

Rounded

Add Photo Change
Remove

Copy

<image-upload
  type="avatar"
  select-text="Add photo"
  @change="onAvatarChange"
/>

<script>
import ImageUpload from '@/components/ImageUpload';
export default{
  components: {
    ImageUpload
  },
  methods: {
    onImageChange(file) {
      this.images.regular = file;
    },
    onAvatarChange(file) {
      this.images.avatar = file;
    }
  }
}
</script>