n-table

Render HTML tables with Naive UI styling options.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides a straightforward way to render clean, customizable HTML tables with Naive UI's n-table, reducing boilerplate and ensuring consistent styling.

Core Features & Use Cases

  • Basic table rendering: simple, reliable HTML table output with responsive sizing.
  • Styling options: supports bordered, striped, and size variations for visual emphasis.
  • Composable usage: integrates easily with other Naive UI components and sub-tables.

Quick Start

Create a basic table using n-table with sample data to render a bordered, striped table.

Frequently Asked Questions about n-table

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

FAQPage Schema
How do I render simple HTML tables with styling options in Vue?▼

To render simple HTML tables with styling options in Vue, use the n-table component to apply bordered, striped, and size variations for clean, responsive data presentation without boilerplate.

What is the best way to display static data in lightweight Vue dashboards?▼

The best way to display static data in lightweight Vue dashboards is using the n-table component, which provides reliable HTML table rendering with consistent visual styling for documentation and simple interfaces.

Does Naive UI support nested table usage for complex data presentation?▼

Yes, Naive UI supports nested table usage through the n-table component, allowing you to embed sub-tables within parent tables for structured data display while maintaining consistent styling.

Can I apply striped and bottom-bordered styles simultaneously to HTML tables?▼

Yes, you can apply striped and bottom-bordered styles simultaneously to HTML tables by configuring the respective props on the n-table component for customized visual emphasis.

When should I avoid using n-table for frontend data presentation?▼

You should avoid using n-table for frontend data presentation when complex user interactions, dynamic sorting, or advanced data filtering are required, as it is designed for static data and lightweight dashboards.

Do I need additional dependencies to use n-table in my Vue project?▼

You do not need additional dependencies to use n-table in your Vue project beyond the Naive UI library, as the component operates independently to render styled HTML tables with zero external dependencies.