How to create custom start/end date Vue custom validator

Question

I am trying to create a custom Vue validator. I have reviewed their docs https://vuelidate.netlify.com/#custom-validators, as well as a very useful tutorial https://vuejsdevelopers.com/2018/08/27/vue-js-form-handling-vuelidate/.

However, I still don't see a clear example of how to do the following:

I have two datepicker input fields, a start and end date. I want to be able to create a validator which can

1. Check both dates in tandum to make sure that the end date is not before the start date
2. Have a single validation message based on this (aka: we don't want one field with 'Start date can't be before end date' and the other with 'End date can't be before start date')

This type of functionality (or using other fields values inside a different one) is basically what the core sameAs validator (see below) has:

    import { ref, withParams } from './common'
    export default (equalTo) =>
    withParams({ type: 'sameAs', eq: equalTo }, function(value, parentVm) {
      return value === ref(equalTo, this, parentVm)
    })

I have tried to mimic this, but its not working...

    import { ref, withParams } from 'vuelidate/lib/validators/common.js'
    export default (endDate) =>
    withParams({ type: 'dateRange', eq: endDate }, function(value, parentVm) {
        console.log('parentVm', parentVm);
        return value < ref(endDate, this, parentVm)
    })

Its not even logging my console.log. Here is the code calling it

    <date-picker id="financial-start-date" v-model="$v.start_date.$model" :config="datepickerConfig"></date-picker>
    <date-picker id="financial-end-date" v-model="$v.end_date.$model" :config="datepickerConfig"></date-picker>

Validations:

    validations: {
            transaction_id: {

            },
            start_date: {

            },
            end_date: {
                dateRange: dateRange('startDate')
            }
        },

Answer 1

Can be solved using the following code:

first create custom validator:

const isAfterDate = (value, vm) => {
    return new Date(value).getTime() > new Date(vm.startDate).getTime();
};

Second, call the validator within validations:

    endDate: {
      required,
      isAfterDate
    }