GerkinDev/vuejs-datatable

<table :class="tableClass">
    <thead>
        <tr>
            <datatable-header
                v-for="(headColumn, i) in normalizedColumns"
                :key="i"
                :column="headColumn"
                :direction="getSortDirectionForColumn(headColumn)"
                @change="setSortDirectionForColumn" />
        </tr>
    </thead>
    <tbody>
        <slot
            v-for="(row, i) in displayedRows"
            :row="row"
            :index="i"
            :columns="normalizedColumns">
            <tr
                :key="i"
                :class="getRowClasses(row)">
                <datatable-cell
                    v-for="(column, j) in normalizedColumns"
                    :key="j"
                    :column="column"
                    :row="row" />
            </tr>
        </slot>
        <tr v-if="displayedRows.length == 0">
            <td :colspan="normalizedColumns.length">
                <slot name="no-results" />
            </td>
        </tr>
    </tbody>
    <tfoot v-if="$slots.footer || $scopedSlots.footer">
        <slot
            name="footer"
            :rows="displayedRows"
            :columns="normalizedColumns"
            :pagination="currentPageRange" />
    </tfoot>
</table>