Attach validation rule to form field programmatically
The way I got around this feels hacky but I couldn't get it to work with my original approach.
For date fields that required a dynamic range I ended up using the directive style rules string and concatenated a computed property.
For example:
computed: { ninetyNineYearsAgo() { return new Date().getFullYear() - 99; }, eighteenYearsAgoFormatted() { let eighteenYearsAgo = new Date().getFullYear() - 18; let todayISODate = new Date().toISOString().split('T')[0]; return eighteenYearsAgo + '-' + todayISODate.split('-')[1] + '-' + todayISODate.split('-')[2]; } }<div class="input-group"> <input type="date" class="form-control" name="panelData.AnalysisDate" data-vv-as="Analysis Date" v-model="panelData.AnalysisDate" v-validate="'date_format:YYYY-MM-DD|date_between:' + ninetyNineYearsAgo +'-01-01,'+ eighteenYearsAgoFormatted + ',true'"></div>