Jul 29, 2023
0
Level 15
Empty array when submitting images using spatie/media-library pro components with inertiajs & vuejs
Having quite a time submitting an image using spatie/media-library with inertiajs.
I have this working great in another project without inertia however, the media-library component does not seem to pass the images to the form.projectPics. Upon a post request the payload is always: "projectPics": null,
I've tried submitting without inertia, this.projectPics as a separate attribute.
What is preventing the images from being submitted?
Thank you very much ~
//createproject.vue
<template>
...
<div id="projectPicUploaderCreate">
<media-library-attachment
name="projectPics"
v-model="form.projectPics"
:max-items="10"
:validation-rules="{
accept: ['application/pdf', 'image/png', 'image/jpeg'],
maxSizeInKB: 15360,
}"
:validation-errors="$errors"
multiple
@is-ready-to-submit-change="isReadyToSubmit = $event"
@has-uploads-in-progress-change="hasUploadsInProgress = $event"
/>
</div>
...
</template>
<script>
import { MediaLibraryAttachment } from "../../../../vendor/spatie/laravel-medialibrary-pro/resources/js/media-library-pro-vue3-attachment";
import { useForm } from "@inertiajs/vue3";
export default {
components: {
MediaLibraryAttachment,
},
...
data() {
return {
hasUploadsInProgress: true,
isReadyToSubmit: true,
form: useForm({
...
projectPics: null,
...
methods: {
store() {
this.form.post("/projects",
//also tried { projectPics: this.projectPics }
}
Please or to participate in this conversation.