Ga naar hoofdinhoud

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

PropTypeDefaultDescription
objectsArray[]The objects to render as rows.
schemaObjectnullSchema passed through to each CnObjectRow.
configObject{}Field-mapping config passed through to each row.
loadingBooleanfalseShow the loading state.
selectableBooleanfalseWhether rows can be selected.
selectedIdsArray[]The currently selected object ids.
rowKeyString'id'Property used as the unique identifier.
emptyTextString(i18n)Text shown when there are no objects.

Slots

  • #list-item="{ object, selected }" — fully replace the row (bypasses CnObjectRow).
  • #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

NameTypeRequiredDefaultDescription
objectsarray[]Array of objects to display as rows
schemaobjectnullSchema 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.
loadingbooleanfalseWhether data is loading
selectablebooleanfalseWhether rows can be selected
selectedIdsarray[]Array of currently selected object IDs
rowKeystring'id'Property name used as unique identifier
emptyTextstring() =&gt; t('nextcloud-vue', 'No items found')Text shown when there are no objects

Events

NamePayloadDescription
clickEmitted when a non-selectable row is clicked (navigation).
selectEmitted when the selected-id set changes.

Slots

NameBindingsDescription
emptyempty Custom empty state shown when there are no objects.
list-itemobject, selected, schema, configlist-item Fully replace the default row (bypasses CnObjectRow).
row-actionsobjectrow-actions Trailing actions on the default row.
row-badgesobjectrow-badges Badge area on the default row.
row-iconobjectrow-icon Leading icon/image on the default row.