Closed
Description
Given the following component:
<template>
<div>
<vue-form-generator :schema="schema" :model="model" :options="options"></vue-form-generator>
{{ model }}
</div>
</template>
<script>
import Vue from 'vue'
import VueFormGenerator from 'vue-form-generator'
Vue.use(VueFormGenerator)
export default {
data () {
model: {
dob: ''
},
schema: {
fields: [{
type: 'cleave',
label: 'Date of birth',
model: 'dob',
cleaveOptions: {
date: true,
datePattern: ['d', 'm', 'Y'],
delimiter: '/'
}
}]
}
}
}
</script>
The model will erroneously accept an additional character at the end of input. The model will be updated in Vue, but the change isn't shown within the actual input element.
For example, the above component will allow me to enter: 030420011. The value in the model will be 03/04/20011, BUT the value in the actual field will be 03/04/2001.
If I backspace, the value in the model is reduced by 2 characters with the value in the actual field being reduced to 1.
