Table Component

Without any props


1	Isobel	Bradtke	53
2	Kip	Waters	75
3	Graham	Bergnaum	36
4	Juwan	Parisian	37
5	Anika	Rogahn	56
6	Hailie	Ernser-Hermann	43
7	Rosemarie	Bergstrom	47
8	Gaston	Wisoky	39
9	Woodrow	Walter	68
10	Destini	Gerlach	26
11	Gracie	Marquardt	51
12	Shanny	Hansen	96
13	Carlie	Rice	48
14	Mireille	Steuber	49
15	Davon	Rau	37
16	Alvena	Gusikowski	33
17	Zakary	Cormier	60
18	Mortimer	Rippin	58
19	Harmony	Connelly	90
20	Laurie	Hudson	98
21	Taryn	Hahn	82
22	Richmond	Reynolds	35
23	Nils	McKenzie	99
24	Jordi	Haag	71
25	Kasandra	Marvin	15
26	Raul	Crooks	77
27	Frederick	Reichert	36
28	Anthony	McClure	47
29	Rodolfo	Wilderman	42
30	Heath	Abernathy	81
31	Maybell	Miller	84
32	Rosamond	Jacobson	97
33	Ahmad	Runolfsson	83
34	Adaline	Murphy	84
35	Verla	Corkery	89
36	Fredrick	Donnelly	69
37	Roma	Beatty	68
38	Kenton	Swift	91
39	Antonette	Erdman	63
40	Marilyne	Romaguera	26
41	Kobe	Kuhic	76
42	Ethel	Mann	66
43	Madisyn	Dare	52
44	Percival	Frami	97
45	Kenny	Hilpert	28
46	Ray	Walsh	95
47	Chadd	Rath-Wisozk	77
48	Alfonso	Murphy	11
49	Alexys	Feeney	69
50	Maxine	Moore	33

html

<JiaHaoTable
  v-model="data"
  v-model:select="selected"
  v-bind="state"
  :columns="[
          { key: 'id', label: 'ID', sortable: true },
          { key: 'image', label: '' },
          { key: 'firstName', label: 'First Name', sortable: true },
          { key: 'lastName', label: 'Last Name', sortable: true },
          { key: 'age', label: 'Age', sortable: true },
        ]"
>
  <template #item-image="{ item }">
    <JiaHaoAvatar
      :src="item.image"
      size="xs"
      :placeholder="`${item.firstName.charAt(0)}${item.lastName.charAt(0)}`"
      class="bg-gray-500"
    />
  </template>
</JiaHaoTable>

Table Component ​

Without any props ​

Table Component

Without any props