#1128·vuelidate

Typescript not working for nested objects

Author: maltsavkirylCreated Nov 3, 2022Updated Apr 3, 2025
Labelsbug0.x

Describe the bug I have a form that I'm trying to validate with some nested fields.

typescript
export interface CreateContract {
  id: number | null;
  contractStartsAt: { iso: Date };
  contractEndsAt: { iso: Date };
  isIncomeGuaranteed: boolean;
}

I created rules to match the object with my validators

typescript
type CreateContractRules = ValidationArgs<Partial<CreateContract>>;

const contractInformationRules: Ref<CreateContractRules> = computed(() => {
    return {
      contractStartsAt: { iso: { required } },
      contractType: { id: { required } },
      isIncomeGuaranteed: {}
    };
  });

So now I would expect that the type of v$.contractStartsAt.iso.$model is a Date. But when I hover on $model I receive $model: ref<any>.

If I do the same on a field that isn't nested, for example $.isIncomeGuaranteed.$model I do receive the correct type (boolean).

Am I doing something wrong or is vuelidate not smart enough to give me the correct type on nested objects?

Screenshots When hovering on v$.isIncomeGuaranteed.$model

Screenshot 2022-11-03 at 11 06 06

When hovering on v$.contractStartsAt.iso.$model

Screenshot 2022-11-03 at 11 06 14