Vue Formulate Date Picker Validation - vue.js

Question

I've been using the Vue Formulate library (which is awesome).
I need the user to only be able to pick a date from today (included) onwards.
I am using the "after" default for validation, but today (the current date) is not valid. In other words the validation kicks in when choosing todays date, and the form cannot be submitted.
What is the best way to get around this?
https://codesandbox.io/s/vue-formulate-reproduction-template-forked-kmpgq?fontsize=14&hidenavigation=1&theme=dark

Answer 1

A little workaround by giving the after attribute a Date value before today:
<template>
<FormulateInput
name="date"
label="Date:"
:validation="
'bail|required|after:' + new Date(Date.now() - 24 * 60 * 60 * 1000)
"
:validation-messages="{ after: 'The date has to be today or later' }"
type="date"
/>
</template>
https://codesandbox.io/s/vue-formulate-reproduction-template-forked-ky1hu?fontsize=14&hidenavigation=1&theme=dark
EDIT: In fact you can do it also with a computed property by returning the date before today.

Answer 2

After validation should defined by a Date. Here is the solution by calculating today by a computed property. Codesandbox
<template>
<FormulateInput
name="date"
label="Date:"
:validation="'bail|required|after:' + today"
:validation-messages="{ after: 'The date has to be today or later' }"
type="date"
/>
</template>
<script>
export default {
computed: {
today() {
return new Date().toLocaleDateString();
},
},
};
</script>