@acarat/vue-grouped-table 中文文档教程

Question

vue-grouped-table

Usage

Install

npm install @acarat/vue-grouped-table

Import the component

import { GroupedTable } from "@acarat/vue-grouped-table";

Use the component in your Vue project

<GroupedTable :headers="[
                          'city',
                          'name',
                          'age',
                          'genre'
                        ]"
              :entries="[
                          { city: 'Dublin', name: 'Antoine', age: 23, genre: 'M' },
                          { city: 'Dublin', name: 'Margaux', age: 24, genre: 'F' },
                          { city: 'Nantes', name: 'Mattis', age: 23, genre: 'M' },
                          { city: 'Nantes', name: 'Hugo', age: 24, genre: 'M' },
                          { city: 'Nantes', name: 'Laurie', age: 23, genre: 'F' },
                          { city: 'Marrakech', name: 'Amr', age: 25, genre: 'M' }
                        ]"
/>

Props

headers

headers 必须是包含表头的数组，即数据分组所依据的属性。

entries

条目是原始数据本身，必须是对象数组。