Reference

Guide

Collection

<k-collection>

The k-collection component is a wrapper around k-cards and k-list-items that makes it easy to switch between the two layouts and adds sortabilty and pagination to the items.

<k-collection layout="cards" :items="[
  {
    text: 'a.jpg',
    image:   { ... },
    options: [ ... ]
  },
  {
    text: 'b.jpg',
    image:   { ... },
    options: [ ... ]
  },
  {
    text: 'c.jpg',
    image:   { ... },
    options: [ ... ]
  }
]" />

Props

items

Array|Object (default: [])

layout

String (default: "list")

sortable

Boolean (default: false)

pagination

Boolean|Object (default: false)

Events

action

Emitted on every dropdown action / option

change

Emitted whenever the sorting changes

paginate

Emitted when the pagination changes

sort

Emitted when the sorting has stopped

CSS class

.k-collection