Skip to content

Tables

Some content on this page is not responsive yet and may not display correctly on mobile devices.
#
Name
Age
001
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla nec diam nec nisl aliquam ultric es.
55
002
Preston
51
003
Olive
21
004
Jaxon
76
005
Omar
78
006
Kurt
60
007
Mark
23
008
Matt
45
009
Jane
32
010
Ophelia
54
011
Jill
54
012
Nick
69
013
Kane
67
014
Olivia
46
015
Mila
37
016
Mary
55
017
Jasmine
50
018
Ophelia
66
019
Jenna
68
020
Kara
44
021
Jasmine
41
022
Owen
79
023
Logan
68
024
Ophelia
77
025
Nadia
58
026
Jesse
44
027
Mila
26
^ K
#NameAge
001Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla nec diam nec nisl aliquam ultric es.55
002Preston51
003Olive21
004Jaxon76
005Omar78
006Kurt60
007Mark23
008Matt45
009Jane32
010Ophelia54
per page
1 of 100

Code

import * as G from '.../components';

<G.Table
  height={300}
  columns={[
    { key: 'id', label: '#' },
    { key: 'name', label: 'Name' },
    { key: 'age', label: 'Age' },
  ]}
  rows={[
    { id: '0001', name: 'John', age: 20 },
    { id: '0002', name: 'Jane', age: 21 },
    { id: '0003', name: 'Joe', age: 22 },
    ...
  ]}
/>

<G.PagedTable
  columns=...
  rows=...
/>

Properties

This component extends the Base Component and supports all of its properties.
GentlentAn official Gentlent website. Official Gentlent websites are always linked from our website gentlent.com, or contain an extended validated certificate.
Skyline Dusseldorf