CnObjectList
Vertical list container for CnObjectRow instances — the list-mode counterpart to CnCardGrid. Renders objects as compact rows with selection, loading/empty states, and full row override.
<CnObjectList
:objects="secrets"
:schema="secretSchema"
:config="{ subtitleField: 'url', iconName: 'Key' }"
@click="openSecret">
<template #row-actions="{ object }">
<NcButton @click="copy(object)">Copy</NcButton>
</template>
</CnObjectList>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
objects | Array | [] | The objects to render as rows. |
schema | Object | null | Schema passed through to each CnObjectRow. |
config | Object | {} | Field-mapping config passed through to each row. |
loading | Boolean | false | Show the loading state. |
selectable | Boolean | false | Whether rows can be selected. |
selectedIds | Array | [] | The currently selected object ids. |
rowKey | String | 'id' | Property used as the unique identifier. |
emptyText | String | (i18n) | Text shown when there are no objects. |
Slots
#list-item="{ object, selected }"— fully replace the row (bypassesCnObjectRow).#row-icon/#row-badges/#row-actions— override just one part of the default row.#empty— custom empty state.
It is the surface behind CnIndexPage's view-mode="list".
Props
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
objects | array | [] | Array of objects to display as rows | |
schema | object | null | Schema definition (passed through to CnObjectRow) | |
config | { titleField?: string, subtitleField?: string, imageField?: string, iconField?: string, iconName?: string, badgeField?: string, badgeVariantField?: string, badgeVariant?: string, badgeColorMap?: object } | \{\} | Field-mapping config passed through to CnObjectRow. | |
loading | boolean | false | Whether data is loading | |
selectable | boolean | false | Whether rows can be selected | |
selectedIds | array | [] | Array of currently selected object IDs | |
rowKey | string | 'id' | Property name used as unique identifier | |
emptyText | string | () => t('nextcloud-vue', 'No items found') | Text shown when there are no objects |
Events
| Name | Payload | Description |
|---|---|---|
click | — | Emitted when a non-selectable row is clicked (navigation). |
select | — | Emitted when the selected-id set changes. |
Slots
| Name | Bindings | Description |
|---|---|---|
empty | — | empty Custom empty state shown when there are no objects. |
list-item | object, selected, schema, config | list-item Fully replace the default row (bypasses CnObjectRow). |
row-actions | object | row-actions Trailing actions on the default row. |
row-badges | object | row-badges Badge area on the default row. |
row-icon | object | row-icon Leading icon/image on the default row. |