Error in render: "RangeError: date value is not finite in DateTimeFormat.format()

Question

I have tried several postings to see what might be the problem, but so far I haven't been able to.

I have this JSON:

{"patientId":3,"internalId":"64","firstName":"Sid","lastName":"Vicious","gender":"Male","race":"","ethnicity":"White","activationDate":"2020-06-09","dateOfBirth":"2022-08-02","address":{"addressId":10,"addressLine1":"130 Maple","addressLine2":"","city":"Houston","state":"TX","zip":"1111-1234","latitude":null,"longitude":null},"fullName":"Vicious, Sid"}

And this code to show a date picker when the field is clicked:

<v-menu
   v-model="showDobPicker"
   :close-on-content-click="false"
   transition="scale-transition"
   offset-y
   max-width="290px"
   min-width="290px"
   >
   <template v-slot:activator="{ on }">
     <v-text-field
       label="Date of Birth "
       prepend-icon="mdi-calendar"
       readonly
       v-model="form.dateOfBirth"
       v-on="on">
     </v-text-field>
   </template>
     <v-date-picker
       v-model="form.dateOfBirth"
       no-title
       @input="showDobPicker = false"
     ></v-date-picker>
     </v-menu>

However, when I click the field, I get the following error:

[Vue warn]: Error in render: "RangeError: date value is not finite in DateTimeFormat.format()"

However, the date looks valid to me, it even displays correctly