3F Design v1.10.0

Table

Component name: <v-table> + <v-row> + <v-cell>

Examples

Basic

Emne
Kategori
Dato
Status
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
Ansøgning om dagpenge
Dagpenge
I dag, 10:48
ÅBEN
<div class="app">
  <v-table :columns="['Emne', 'Kategori', 'Dato', 'Status']">
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
    <v-row>
      <v-cell>Ansøgning om dagpenge</v-cell>
      <v-cell>Dagpenge</v-cell>
      <v-cell>I dag, 10:48</v-cell>
      <v-cell>ÅBEN</v-cell>
    </v-row>
  </v-table>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

Components

v-table

API

Name Type Description Default
columns [String] Columns to show in table -

v-row

v-row acts as a tr

v-cell

v-cell acts as a td


Notice

All other properties that are not defined above, will be passed to the component as html attributes. This is especially useful for adding the class attribute.

← Text →