maxFiles doesn't work as I try to attach files and try 2 limit the files to be uploaded

[abrhambas01]

I have this line of html

<div class="flex inline-block">
                    <div id="input-group" class="w-full">   
                        <label for="name" class="block uppercase tracking-wide text-black-v2 text-xs font-bold mb-2">Upload a photo of yours : 
                        </label>
                        <upload-image :url="uploadUrl" :maxFiles="form.maxFiles"></upload-image>
                    </div>
                </div>

<script>
import UploadImage from 'vue-upload-image';
import urls from './scripts/endpoints.js';

this is in my data fnction

data () {
        return {
            form : { 
                username : this.user.username, 
                email : this.user.email, 
                password : this.user.password, 
                display_name : this.user.display_name,
                phone_number : this.user.phone_number,
                country_id : this.user.country_id,
                maxFiles : 1,
                uploadUrl : urls.update_profiles_endpoint,
            },
            countries : this.country
        }
    },

[viral-vector]

@abrhambas01 apologies for the late reply; away on a short vacation. Your issue here is that you have the prop name incorrectly set. You are looking for max_files instead of maxFiles. :max_files="form.maxFiles".