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.