n-form

Validate and manage user input in Naive UI forms.

8|3|Updated Mar 13, 2026
One-click install
npx skills add https://github.com/jiaiyan/naive-ui-skills --skill n-form
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: n-form
Source: https://github.com/jiaiyan/naive-ui-skills/tree/main/components/n-form
Command: npx skills add https://github.com/jiaiyan/naive-ui-skills --skill n-form

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Collect and validate user input efficiently in Naive UI applications, reducing boilerplate and errors.

Core Features & Use Cases

  • Data collection and validation with flexible layout options and seamless integration with inputs.
  • Dynamic forms that support adding, removing, and nesting fields for complex data structures.
  • Robust submission flow with built-in rules, async validators, and clear error handling.

Quick Start

Create an n-form bound to a model and a rules object, then handle submit to process valid data.

Frequently Asked Questions about n-form

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I validate user input in Naive UI forms?▼

To validate user input in Naive UI forms, bind an n-form component to a data model and a rules object, then trigger validation to process the submitted data.

Can I build dynamic forms with nested fields using Vue 3 and Naive UI?▼

Yes, you can build dynamic forms with nested models in Vue 3 and Naive UI, supporting the addition, removal, and grouping of fields for complex data structures.

How do I use grid layout for form items in a Vue 3 application?▼

You can use grid-based layouts in Vue 3 by grouping fields with n-form-item-gi, enabling flexible label placements and structured form item grouping.

What is the best way to handle validation state reset in dynamic forms?▼

The best way to handle validation state reset is using utilities like restoreValidation to clear errors when dynamically modifying form fields and nested models.