\n \u003C/UFormGroup>\n \u003CUFormGroup label=\"Training Week\" name=\"trainingWeek\">\n \u003Cdiv v-for=\"(day, index) in state.trainingWeek\" :key=\"index\">\n \u003CUFormGroup label=\"Day\" name=\"trainingWeek[' + index + '].day\">\n \u003CUInput v-model=\"day.day\" />\n \u003C/UFormGroup>\n \u003CUFormGroup label=\"Exercises\" name=\"trainingWeek[' + index + '].exercises\">\n \u003Cdiv v-for=\"(exercise, exerciseIndex) in day.exercises\" :key=\"exerciseIndex\">\n \u003CUInput v-model=\"exercise.exerciseName\" />\n \u003C/div>\n \u003C/UFormGroup>\n \u003Cdiv class=\"mt-4 flex justify-end\">\n \u003CUButton @click=\"addExercise(index)\">Add Exercise\u003C/UButton>\n \u003C/div>\n \u003C/div>\n \u003C/UFormGroup>\n \u003Cdiv class=\"mt-4 flex justify-end\">\n \u003CUButton @click=\"addDay\">Add Day\u003C/UButton>\n \u003CUButton type=\"submit\">Submit\u003C/UButton>\n \u003C/div>\n \u003C/UForm>\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nimport { z } from \"zod\";\nimport type { FormSubmitEvent } from \"#ui/types\";\nconst state = reactive({\n name: \"\",\n trainingWeek: [\n {\n day: \"\",\n exercises: [\n {\n exerciseName: \"\",\n },\n ],\n },\n ],\n});\n\nconst schema = z.object({\n name: z.string().min(1, \"Required field\"),\n trainingWeek: z.array(\n z.object({\n day: z.string().min(1, \"Required field\"),\n exercises: z.array(\n z.object({\n exerciseName: z.string().min(1, \"Required field\"),\n }),\n ),\n }),\n ),\n});\n\ntype Schema = z.infer\u003Ctypeof schema>;\n\nconst handleSubmit = (event: FormSubmitEvent\u003CSchema>) => {\n console.log(JSON.stringify(event.data, null, 2));\n};\n\nconst addExercise = (index: number) => {\n state.trainingWeek[index].exercises.push({ exerciseName: \"\" });\n};\n\nconst addDay = () => {\n state.trainingWeek.push({ day: \"\", exercises: [{ exerciseName: \"\" }] });\n};\n\u003C/script>\n\n```\n\nI render the form based on state and dynamically add fields.\n\nThe form automatically sets up errors for name ( or any first level fields ) but doesn't set up errors for nested ones like day or exerciseName in the above example\n\nWhat's the proper way to create dynamic forms and avail error setting ? \n\nI'm able to get the following:\n```json\nprofile.vue:68 ZodError: [\n {\n \"code\": \"too_small\",\n \"minimum\": 1,\n \"type\": \"string\",\n \"inclusive\": true,\n \"exact\": false,\n \"message\": \"Required field\",\n \"path\": [\n \"trainingWeek\",\n 0,\n \"day\"\n ]\n },\n {\n \"code\": \"too_small\",\n \"minimum\": 1,\n \"type\": \"string\",\n \"inclusive\": true,\n \"exact\": false,\n \"message\": \"Required field\",\n \"path\": [\n \"trainingWeek\",\n 0,\n \"exercises\",\n 0,\n \"exerciseName\"\n ]\n }\n]\n```\noutput by parsing schema \n```js\nwatchEffect(() => {\n try {\n schema.parse(state);\n } catch (error) {\n console.error(error);\n }\n});\n```\n\n",[2934],{"name":2935,"color":2936},"question","d876e3",2674,"How to ensure UForm and UFormGroup auto assigns errors for nested dynamic form.","2024-11-18T16:59:59Z","https://github.com/nuxt/ui/issues/2674",0.68746215,{"description":2943,"labels":2944,"number":2949,"owner":2912,"repository":2913,"state":2914,"title":2950,"updated_at":2951,"url":2952,"score":2953},"### For what version of Nuxt UI are you suggesting this?\n\nv2.x\n\n### Description\n\nIt would be great if there was an option for eager validation if there are errors present on the group.\n\nFor example, when initially filling out the field you don't want eager validation as it's distracting when you aren't finished typing.\n\nHowever if you tab away and there's an error, when fixing the error you'd want immediate feedback with eager-validation.\n\nSo I propose a new prop: `eager-validation-on-error=\"true\"` to improve the UX of forms.\n\nThanks!\n\n### Additional context\n\n_No response_",[2945,2948],{"name":2946,"color":2947},"enhancement","a2eeef",{"name":2906,"color":2907},2599,"FormGroup eager-validation when errors exist","2025-06-29T17:15:23Z","https://github.com/nuxt/ui/issues/2599",0.70505327,{"description":2955,"labels":2956,"number":2971,"owner":2912,"repository":2912,"state":2914,"title":2972,"updated_at":2973,"url":2974,"score":2975},"### Describe the feature\r\n\r\nI saw that Astro 2.0's error messages were quite lovely, and thought I'd share and pose the question of whether we could make similar enhancements to Nuxt's error messaging.\r\n\r\n\r\n\r\nThe two biggest wins I see implemented:\r\n- Direct links to docs related specifically to the type of error\r\n- The ability to \"open in editor\" directly to the file in your code that initiated the error\r\n\r\nBeyond that, just the overall aesthetic presentation of the error is well-executed.\r\n\r\nI'd be more than happy to assist in any way possible to improve error messaging - particularly on the visual design / presentational side. I'll do some initial digging into the Nuxt code to see how you currently source errors and where the presentation template resides. Would love to hear thoughts from the core team and community on these and other ways to improve the error messaging!\r\n\r\n### Additional information\r\n\r\n- [X] Would you be willing to help implement this feature?\r\n- [ ] Could this feature be implemented as a module?\r\n\r\n### Final checks\r\n\r\n- [X] Read the [contribution guide](https://nuxt.com/docs/community/contribution).\r\n- [X] Check existing [discussions](https://github.com/nuxt/nuxt/discussions) and [issues](https://github.com/nuxt/nuxt/issues).",[2957,2959,2962,2965,2968],{"name":2946,"color":2958},"8DEF37",{"name":2960,"color":2961},"discussion","538de2",{"name":2963,"color":2964},"3.x","29bc7f",{"name":2966,"color":2967},"dx","C39D69",{"name":2969,"color":2970},"🍰 p2-nice-to-have","0E8A16",18606,"Improved Error Messages","2023-03-23T16:35:37Z","https://github.com/nuxt/nuxt/issues/18606",0.717714,{"description":2977,"labels":2978,"number":2982,"owner":2912,"repository":2912,"state":2914,"title":2983,"updated_at":2984,"url":2985,"score":2986},"I need `views/error.html` to show my own nuxt.js error, not the configuration of `messages.server_error` and `messages.server_error_details`\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2433\">#c2433\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2979],{"name":2980,"color":2981},"2.x","d4c5f9",2804,"Nuxt error is static","2023-01-18T16:02:39Z","https://github.com/nuxt/nuxt/issues/2804",0.7268026,{"description":2988,"labels":2989,"number":2998,"owner":2912,"repository":2913,"state":2914,"title":2999,"updated_at":3000,"url":3001,"score":3002},"### Environment\n\nnot needed\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.1.0\n\n### Reproduction\n\nnot needed\n\n### Description\n\nThere is no error state on the input field like color \"error\" when u wrap URadioGroup in UFormField\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2990,2991,2994,2995,2996],{"name":2903,"color":2904},{"name":2992,"color":2993},"needs reproduction","CB47CF",{"name":2906,"color":2907},{"name":2909,"color":2910},{"name":2997,"color":2925},"closed-by-bot",4025,"RedioGroup in Form","2025-05-07T02:09:29Z","https://github.com/nuxt/ui/issues/4025",0.7311425,{"description":3004,"labels":3005,"number":3012,"owner":2912,"repository":2913,"state":2914,"title":3013,"updated_at":3014,"url":3015,"score":3016},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v23.9.0\n- Nuxt Version: 3.15.4\n- CLI Version: 3.22.3\n- Nitro Version: -\n- Package Manager: pnpm@10.5.2\n- Builder: -\n- User Config: compatibilityDate, devtools, modules, css, ui, runtimeConfig\n- Runtime Modules: @nuxt/ui-pro@3.0.0-beta.2, @pinia/nuxt@0.10.1\n- Build Modules: -\n------------------------------\n\n👉 Report an issue: https://github.com/nuxt/nuxt/issues/new?template=bug-report.yml\n👉 Suggest an improvement: https://github.com/nuxt/nuxt/discussions/new\n👉 Read d\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-beta.2\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/relaxed-scooby-nv4zrp?file=%2Fapp%2Fpages%2Findex.vue%3A7%2C51\n\n### Description\n\nI was importing type `FormSubmitEvent` from Nuxt UI but when I shifted to nuxt ui pro and replaced the import. But it broke, because nuxt ui pro doesn't export this type\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3006,3007,3008,3011],{"name":2903,"color":2904},{"name":2906,"color":2907},{"name":3009,"color":3010},"nuxt/ui-pro","00dc82",{"name":2909,"color":2910},3465,"type `FormSubmitEvent` not working in nuxt ui pro version 3","2025-05-10T17:33:04Z","https://github.com/nuxt/ui/issues/3465",0.7312081,{"description":3018,"labels":3019,"number":3022,"owner":2912,"repository":2912,"state":2914,"title":3023,"updated_at":3024,"url":3025,"score":3026},"### What problem does this feature solve?\n\nThis features solves horribly bad error messages.\n\nNuxt prompts unusable error messages. Here's one I bumped in today...\n\n~~~~\nERROR 'set' on proxy: trap returned falsish for property '_nuxtConfigFile' 19:43:15\n\n at Object.loadNuxtConfig (node_modules/@nuxt/cli/dist/cli-chunk2.js:2500:29)\n at NuxtCommand.getNuxtConfig (node_modules/@nuxt/cli/dist/cli-chunk.js:198:36)\n at \u003Canonymous>\n at process._tickCallback (internal/process/next_tick.js:160:7)\n at Function.Module.runMain (module.js:703:11)\n at startup (bootstrap_node.js:193:16)\n at bootstrap_node.js:617:3\n~~~~\n\n\n### What does the proposed changes look like?\n\nA proper stack trace of the true error in my project with references to files in my project, not some meta webpack output that refers to some temporary built files or whatnot.\n\n\u003C!--cmty-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This feature request is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c8968\">#c8968\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3020,3021],{"name":2946,"color":2958},{"name":2980,"color":2981},5431,"Proper error messages","2023-01-22T15:50:56Z","https://github.com/nuxt/nuxt/issues/5431",0.7354431,{"labels":3028,"number":3037,"owner":2912,"repository":2912,"state":2914,"title":3038,"updated_at":3039,"url":3040,"score":3041},[3029,3030,3033,3036],{"name":2924,"color":2910},{"name":3031,"color":3032},"types","2875C3",{"name":3034,"color":3035},"pending triage","E99695",{"name":2980,"color":2981},7502,"vue-router breaks nuxt/types","2023-01-22T15:36:01Z","https://github.com/nuxt/nuxt/issues/7502",0.7406501,["Reactive",3043],{},["Set"],["ShallowReactive",3046],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fppJV2Xn3F85tdfFttGt_U8tb7VW9PHLsFgATZRNy1xk":-1},"/nuxt/ui/2389"]