What is the correct syntax for multiple rules

I have input fields that looks like this:

<input class="img1" type="file" v-validate ="{ rules: { required: imgGroupVal, image: true, size: 8192, mimes: 'image/jpeg,image/jpg,image/png', ext: 'jpg,jpeg,png' } }" >

<input class="img2" type="file" v-validate ="{ rules: { required: imgGroupVal, image: true, size: 8192, mimes: 'image/jpeg,image/jpg,image/png', ext: 'jpg,jpeg,png' } }" >

The only problem is that mimes: 'image/jpeg,image/jpg,image/png', ext: 'jpg,jpeg,png' always fails.

I have also tried to write the rule like this:

v-validate="'required:imgGroupVal|image|size:8192|mimes:image/jpeg,image/jpg,image/png|ext:jpg,jpeg,png'"

But then my required rule doesnt work that is driven by a computed value imgGroupVal

So how do I need to change my syntax bellow in order to make it work v-validate ="{ rules: { required: imgGroupVal, image: true, size: 8192, mimes: 'image/jpeg,image/jpg,image/png', ext: 'jpg,jpeg,png' } }"

[kiwo12345]

@logaretm oh I see. Well thanks again for the help! Its an awesome lib!

[logaretm]

No, you will just pass it as an object directly which works fine, I didn’t update the example properly:

v-validate ="{ required: imgGroupVal, image: true, size: 8192, mimes: ['image/jpeg', 'image/jpg', 'image/png'], ext: ['jpg', 'jpeg', 'png'] }"