Vuetify DateTime Picker and VeeValidate issues

2
votes

Vuetify Stepper, DateTime Picker & VeeValidate Errors

I'm implementing site via Vue using Vuetify and VeeValadite. I have the following issues.

  1. Date doesn't seem to be format. I want in this format '10-Oct-2019'. Used the plugin but it doesn't seem to work.

  2. Getting the following error while I'm trying to select Director's Date Of Birth and value return as false.

[Vue warn]: Invalid prop: type check failed for prop "value". Expected Array, String, got Boolean with value false.

  1. Removing Directors and Shareholders. It's removing first one instead of current one. E.g When I click on 'Remove' of 'Jane Doe' element, it's removing 'John Doe' instead of 'Jane Doe'.

  2. Regarding the VeeValidate, is there a way to collect the error? Now it's showing The directors[index].Name field is required.

This is codepen 

`https://codepen.io/hiro-john/pen/xxxwaWZ`

Finding the solutions for 2 days and I still couldn't solve it. Appreciate your help.

1
vuejs2vuetify.jsvee-validate

1 Answers

0
votes

A partial response regarding Financial Year End date picker:

You're using v-model on the incorrect piece of data, so it's not showing the correct date format (your computed property). Changing the v-model statement to:

v-model="computedDateFormattedMomentjs"

and then changing computedDateFormattedMomentjs to:

computedDateFormattedMomentjs () { return moment(this.Financial_Year_End).format("DD-MMM-YYYY"); }

allows the date to update correctly and display the format you prefer.