Validate fields of objects in form - Vue 3 + Vee-validate + yes
P粉486138196
2023-11-16 13:56:09
0
1
597
I have a form where some fields are inside an object:
...
But the data validation of this object is only done after changing its external fields, i.e. filling ingroup,description,first_name,last_name(in the same order), and the form will not be considered valid only if you editgroupordescriptionagain.
How do I validate when I change a field myself?
Here is the link to the complete code.
I use the following version:
"vue":"^3.2.37", "vee-validate": "^4.5.11", "yup": "^0.32.11"
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
- About us Disclaimer Sitemap
- php.cn：Public welfare online PHP training，Help PHP learners grow quickly！
When you use useField() with an object, nested properties lose their reactive connections. So here are two options to solve this problem: wrap useField with reactive() or use separate useField() for each nested property.
Option 1
const { value: user } =reactive(useField('user'));Option 2
const { value: first_name } = useField('user.first_name'); const { value: last_name } = useField('user.last_name');Here is a working exampleHere