Flux

Appearance

Table row ​

The table row groups multiple cells together to form a single row of data. It organizes related information into a horizontal sequence, making it easy to scan and compare values across columns.

1×1
1×2
1×3
1×4
1×5
1×6
2×1
2×2
2×3
2×4
2×5
2×6

WARNING

This component is best used within a Table.

Slots

default
The content of the table row.

Examples ​

Basic

A basic table row.

1×1
1×2
1×3
1×4
1×5
1×6
2×1
2×2
2×3
2×4
2×5
2×6

<template>
    <FluxPane>
        <FluxTable>
            <FluxTableRow v-for="row in 2">
                <FluxTableCell
                    v-for="cell in 6">
                    {{ row }}&times;{{ cell }}
                </FluxTableCell>
            </FluxTableRow>
        </FluxTable>
    </FluxPane>
</template>

<script
    setup
    lang="ts">
    import { FluxPane, FluxTable, FluxTableCell, FluxTableRow } from '@flux-ui/components';
</script>