https://github.com/anatolykopyl/vuelidate-nesting-question
https://github.com/anatolykopyl/vuelidate-nesting-question
typescript vuelidate
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/anatolykopyl/vuelidate-nesting-question
- Owner: anatolykopyl
- Created: 2022-12-21T17:41:44.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2022-12-21T17:42:06.000Z (almost 3 years ago)
- Last Synced: 2025-01-30T04:41:37.679Z (8 months ago)
- Topics: typescript, vuelidate
- Language: CSS
- Homepage:
- Size: 12.7 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Vuelidate Nesting Question
How do you make a validator for a data structure with a field that has nested fields?
`App.vue` has a form with a Vuelidate validator.
It consists of a name, an address and an optional second Address.
Problem is that `useVuelidate` throws a typescript error on it's second
parameter `userForm`.
```
Argument of type 'Ref<{ name: string; address: { city: string; street: string; }; secondAddress?: { city: string; street: string; } | undefined; }>' is not assignable to parameter of type '{ name: any; address: any; secondAddress: any; } | Ref<{ name: any; address: any; secondAddress: any; }> | ToRefs<{ name: any; address: any; secondAddress: any; }>'.
Type 'Ref<{ name: string; address: { city: string; street: string; }; secondAddress?: { city: string; street: string; } | undefined; }>' is not assignable to type 'Ref<{ name: any; address: any; secondAddress: any; }>'.
```
This happens because the interface `UserForm` has `secondAddress` marked as
optional.
## Question
How do you write the rules in this case, where the field with children is optional?